load php file using form, submit button in html - php

The following codes are HTML and php code. I want if submit button is pressed than execute practice.php file(make test.txt file). But if I pressed the button php doesn't make file. Anyone know about this??
<HTML>
<HEAD>
</HEAD>
<BODY onLoad="tid=setInterval('refresh()',1000);">
<div id="outputDiv"></div>
<form method=post action="practice.php">
<script language="JavaScript">
function refresh()
{
var HTML = "";
HTML += "<input type=submit value=makefile>";
document.getElementById("outputDiv").innerHTML = HTML;
}
</script>
</form>
</BODY>
</HTML>
<html>
<head><meta http-equiv="Content-Type" content="text/html" charset="utf-8">
</head>
<body>
<?
$fp = fopen("test.txt", "w") or die("cannot open file");
$data = "!!!!!!!!!!!!!!!!!!!";
fwrite($fp, $data);
fclose($fp);
echo "!!!!!!!!!!!!!!!";
?>
</body>
</html>

Use "a" flag, If file is not there it will automatically be created.
$fp = fopen("test.txt", "a")
Use JQuery, It would be simple.
<input type="submit" value="Load file" id="button"/>
<script>
//If document is ready.
$(document).ready(function(){
//If button is clicked.
$("#button").click(function(){
//Load a file in "outputdiv" div.
$("#outputDiv").load("test.txt");
//Assuming you are trying to refresh div after 1000 ms sec, Therefor:
setInterval(function(){
$("#outputDiv").load("test.txt");
},1000);
});
});
</script>

You must put the submit button inside the form element. The script puts the submit button inside the <div id="outputDiv"></div> element which is outside of the form element. When you press submit the browser does not know which form to submit.
For example this would work better:
<HTML>
<HEAD>
</HEAD>
<BODY onLoad="tid=setInterval('refresh()',1000);">
<form method=post action="practice.php" id="form">
<script language="JavaScript">
function refresh()
{
var HTML = "";
HTML += "<input type=submit value=makefile>";
document.getElementById("form").innerHTML += HTML;
}
</script>
</form>
</BODY>
</HTML>

Related

Validating PHP $_POST after query form submission

What is the best way to ensure that a logic test on a self-referencing PHP form correctly identifies the HTML button used to submit the form, when that form is actually submitted via jquery.submit() -rather than by a click of the button itself?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Total Tutor </title>
<link type="text/css" rel="stylesheet" href="course.css">
<script src="../jquery.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
//event that triggers the javascript/jquery form submission
$('li').dblclick(function()
{
selectedCourse=$(this).text();
sessionStorage.removeItem('selectedCourse');
sessionStorage.setItem('selectedCourse', selectedCourse);
editForm();
});
//the function called by the normal button submission and the alternative jQuery only submission: note the non jQuery one sets the $-POST variable fine
function editForm() {
var s= confirm( 'Would you like to edit ' +selectedCourse+ '');
if(s)
{
alert('form is called');
}
}
$('#edit-button').click(function() { editForm(); });
});
</script>
<?php
if(!isset($_POST['submit']))
{
?>
<ul>
<li>Maths</li>
<li>English</li>
</ul>
<form id="edit_delete" method="POST" action=" <?php echo $_SERVER['PHP_SELF']; ?>">
<button type="submit" id="edit-button" name="submit" value="edit" ><img src="../images/pencil.png"></button>
<button type="submit" id="delete-button" name="submit" value="delete" ><img src="../images/deleteo.png"></button>
</form>
}
<?php
else
{
if($_POST['submit']=='edit')
{
?>
<p>Thank you for selecting edit</p>
<?php
}
if($_POST['submit']=='delete')
{
?>
<p>Thank you for selecting delete</p>
<?php
}
}
?>
</body>
</html>
Use a variable to indicate how the data was posted.
In your html form:
<input type="hidden" name="wasClicked" id="wasClicked" value="1" />
In your jQuery:
$('#wasClicked').val("0");
Then in your PHP, test $_POST['wasClicked'] to see if it is 0 or 1

PHP serve a file and send a message via jquery?

Ok so say I have the following pages.
index.php
<form action="create_file.php" method="get">
<input type="number" name="num_lines">
<button type="submit">Download File</button>
<form>
create_file.php
<?php
$num_lines = $_GET['num_lines'];
//create a file with $num_lines lines
?>
How would I be able to:
1.) Create a text file with $num_lines lines and serve it to the user
2.) Send a jquery alert to the user to say the download was successful. Ideally the message would be created by create_file.php.
All while staying on index.php?
you can use ajax. please check below link that will alert text which dies in the create_file.php .. check it once
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="get">
<input type="number" id="numLines" name="num_lines">
<button id="button" type="button">Download File</button>
<form>
<script>
$(document).on('click','#button',function(){
var val=$('#numLines').val();
$.post('create_file.php',{val:val},function(r){
alert(r)
});
});
</script>
create_file.php
<?php
$num_lines = $_GET['num_lines'];
die($num_lines);
?>
Client-side approach:
http://jsfiddle.net/uselesscode/qm5ag/
Or, you could do something like:
<?php
$num_lines = $_GET['num_lines'];
$ext = '.txt';
$tmpfname = tempnam("./", "numLines_");
if (file_exists($tmpfname)) {
unlink($tmpfname);
file_put_contents($tmpfname . $ext, $num_lines);
echo json_encode(array('fileUrl' => basename($tmpfname) . $ext));
} else {
echo 'err';
}
?>
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(function(){
$.get('create_file.php', {'num_lines': 42}, function(res){
var response = $.parseJSON(res)
if(typeof response =='object') {
var downloadableFileLink = $('<a></a>').attr('href', response.fileUrl).html("Click here to your file, yo.")
$('#downloadTheRapper').append(downloadableFileLink)
console.log('Oh snap.')
} else {
console.log('err')
}
});
});
</script>
</head>
<body>
<div id="downloadTheRapper"></div>
</body>
</html>

Issue On Getting jQuery Post Result

I am trying to run this simple Ajax Post example like:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.post("test.php",
{
name:"Hello Ajax"
},
function(data){
$("p").html(data);
}
);
});
});
</script>
</head>
<body>
<p></p>
</body>
</html>
and PHP (test.php) as:
<?php
$name = $_POST['name'];
echo '<a>'.$name.'</a>';
?>
No error message but not getting any result back! can you please let me know what I am doing wrong?
Just a simple change, added button element in your markup. Click it and it should work:
<body>
<button>Click Me</button>
<p></p>
</body>
Your javascript is looking for the button element on which when clicked, will trigger the ajaxcall in test.php
$("button").click(function(){
By clicking the button, it will display Hello Ajax, the echo from the test.php and the one that you've send.
$.post("test.php",
{
name:"Hello Ajax"
},

JS - submitting through javascript does not pass post variables

I am using Pure JS to first prevent the form from submitting then I have some validation code and finally automatic submission but the data is not passing from client side to server script.
Here is the HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Chat Room</title>
<link type="text/css" href="main.css" rel="stylesheet" />
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<div id="container" class="add-nick">
<h3>Enter Your Name</h3>
<form action="chat.php" method="post" id="add-nicki">
<input type="text" placeholder="At least 6 alphabets e.g. Jackson" class="text" name="name" />
<input type="submit" value="Submit" class="submit" name="btnsubmit" />
</form>
</div>
</body>
</html>
The JS:
window.onload = function() {
document.forms[0].onsubmit = function(e) {
e.preventDefault();
var regexp = new RegExp("^[A-Za-z]+$"),
elem = this.elements[0],
value = elem.value;
if(regexp.test(value) && typeof value != "null" && value.length > 5) {
elem.className = "text correct";
var formElem = this;
setTimeout(function() { formElem.submit(); }, 0);
}
else elem.className = "text wrong";
};
};
The PHP file:
<?php
session_start();
if(isset($_POST['btnsubmit'])) {
$_SESSION['name'] = $_POST['name'];
echo $_SESSION['name'];
}
else {
if(!isset($_SESSION['name']))
echo "Header";
else
echo $_SESSION['name'];
}
?>
Is there something wrong or JS submit function is not functioning properly ?
The request parameter corresponding to a submit button is only passed if the form is submitted as a result of clicking that button. That's not the case here since you suppress the original form submit (the one triggered by the button), then later call formElem.submit() from JavaScript; no button click means no request parameter, and therefore isset($_POST['btnsubmit']) in your PHP script won't ever return true.
One solution might be to add the btnsubmit parameter to the form's action before submitting it:
formElem.action += (formElem.action.indexOf('?') == -1 ? '?btnsubmit=Submit' : '&btnsubmit=Submit');

dynamic textbox are not store in the textbox

i m creating dynamic text box on onclick event the code is running properly text box are created but the problem is when i create new text box and fill the some value on the first text values are store properly and again create the new text box that time first text box value are automatically delete or null i m trying to solve this error but not getting answer properly please help me....
<html>
<head>
<title>Dynamic Form</title>
<script language="javascript" type="text/javascript" >
function changeIt()
{
createTextbox.innerHTML = createTextbox.innerHTML +"<br><input type='text' name='mytext' >"
}
</script>
</head>
<body>
<form name="form">
<input type="button" value="clickHere" onClick="changeIt()">
<div id="createTextbox"></div>
</form>
</body>
</html>
Please try this,
<script type="text/javascript" language="javascript">
function changeIt() {
var divTag = document.createElement("input");
document.body.appendChild(divTag);
}
</script>
<input type="button" value="Create"
onclick="changeIt();" />
createTextbox is not explicitly available. You'll have to get it by using document.getElementById. Like this...
var createTextbox = document.getElementById("createTextbox");
createTextbox.innerHTML = createTextbox.innerHTML +"<br><input type='text' name='mytext' >";
By using createTextbox.innerHTML =, you replace the current content of the div.
Use the appendChild function to solve it, here is one example:
function addInput(){
//get the div element
var d = document.getElementById('myDiv');
//create an input element
var i = document.createElement("input");
//add it to the div
d.appendChild(i);
}
<!DOCTYPE html>
<html>
<head>
<script>
function changeLink()
{
document.getElementById('createTB').innerHTML="<input type='text' />";
}
</script>
</head>
<body>
<div id="createTB"></div>
<input type="button" onclick="changeLink()" value="Change link">
</body>
</html>

Categories