as i told, i need a form that send some information to another page but do not go to action page. is it possible? a form is like this:
<form name="form2" method="post" action="send.php">
<input type='text' name='name' id='name' value='ali'/>
<input type='text' name='id' id='id' value='123'/>
<input type='text' name='family' id='family' value='ali'/>
</form>
i want when i click on button, just send information. is it possible or needs to use of session?
Use ajax:
var name = $('#name').val();
var id = $('#id').val();
var family = $('#family').val();
$.ajax({
url : 'send.php',
type : 'post',
data : {name:'name',id:'id',family:'family'}
});
Related
I am using Yii.
I have a php file which represents the view.
It has an input field <input type='text' id='client' /> which I want to update after I get a response from the server.
The response should be sent after I enter a value in other field and submit it to the server.
Can you refer me to an example on how to do this?
Thanks.
Or just php:
<form method="post" action="/">
<input type='text' name="client" id='client' value="<?php if(!empty($_POST['client'] )){ echo $_POST['client']; } ?>" />
<input type="submit">
</form>
Send a ajax request on form submit, receive the json object from server and assign it to your textbox. something like this
$('#submitButton').on('click', function(e){
e.preventdefault();
$.post( "ajax/index", function( data ) {
$( "#client" ).val( data.client );
});
});
How to post iframe value in php.
Example:
Username.php
<form action='data.php' method='post'>
<input type='text' name='username' id='username'>
<iframe src='password.php'></iframe>
<input type='submit'>
</form>
Password.php
<input type='text' name='password' id='passwprd'>
I want to post password and username value to data.php
You can do it without session or cookie but with pure javascript.Give your iframe an id.
<iframe id='iframePassword' src='password.php'></iframe>
You can grab username with this
var username = document.getElementById('username').value;
You can access the password field inside the iframe with this.
var ifr = document.getElementById('iframePassword');
var password = ifr.contentWindow.document.getElementById('passwprd').value;
Now make an ajax call with username and password.
try this,
<form action='data.php' method='post'>
<input type='text' name='username' id='username'>
<iframe id="iframe_pass" src='password.php'>
</iframe>
<input id="submit" type='button' value="submit">
</form>
<p id="password_from_frame"></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
$("#submit").on('click', function(){
var pass_field = $("#iframe_pass").contents().find("#password");
var username = $("#username");
var data = {username : username.val(), password : pass_field.val()};
// make an ajax call to submit form
$.ajax({
url : "data.php",
type : "POST",
data : data,
success : function(data) {
console.log(data);
alert(data);
},
error : function() {
}
});
});
// you can use keyup, keydown, focusout, keypress event
$("#iframe_pass").contents().find("#password").on('keyup', function(){
$("#password_from_frame").html($(this).val());
});
</script>
and password.php
<input type='text' name='password' id='password'>
and on the data.php use the print_r to send back the value to the ajax request
print_r($_POST);
If I understood your question correctly, you can store the username and password in PHP session variables and then you can fetch that data from session variables in data.php. As you have two values, its better to store them in an array and then assign the array to the session.
I am a beginner in Ajax and trying to build a simple ajax sample with jquery.
For some reason, my $.post is not working if I am putting my submit button in form tag.
Here is my creat_user.php:
<?php
$user_login = $_REQUEST['login_name'];
echo $user_login;
?>
Here is my html:
<form id='create_user_form'>
<p><label>Login Name : </label><input type='text' name = 'login_name'></p>
<p><label>Password : </label><input type='password' name='login_pw'></p>
<p><label>Re-Enter Password : </label><input type='password' name='login_pw2'></p>
<p><label>Email : </label><input type='email' name='email'></label></p>
<p><label>Date of Birth : </label><input type='date' name='date'></p>
<p><input type='submit' name='submit' id='create' value='create'></p>
</form>
And jquery:
$(document).ready(function(){
$("#create_user_form").submit(function(){
var serialize = $(this).serialize();
alert('Here');
$.post("create_user.php",serialize,function(response){
alert('Here2');
alert(response);
console.log("Response: "+response);
});
});
});
For some reason, the alert('Here2') is never fired, but it will work if I move the submit button out from the form tag, it works.(I do changed the selector in jquery code and changed submit() to click() ):
<form id='create_user_form'>
<p><label>Login Name : </label><input type='text' name = 'login_name'></p>
<p><label>Password : </label><input type='password' name='login_pw'></p>
<p><label>Re-Enter Password : </label><input type='password' name='login_pw2'></p>
<p><label>Email : </label><input type='email' name='email'></label></p>
<p><label>Date of Birth : </label><input type='date' name='date'></p>
</form>
<p><input type='submit' name='submit' id='create' value='create'></p>
SO, is that anything wrong from my code makes .post() not working if I put the submit button into form tag?
Maybe you need add
return false;
at the submit event?
You're missing return false or preventDefault() in the submit handler:
$("#create_user_form").submit(function(){
...
return false;
});
Or
$("#create_user_form").submit(function(e){
e.preventDefault();
...
});
This will prevent the browser from submitting the form after the ajax request is sent.
The default form submit is occurring prior to the Ajax call returning. You should prevent the default action of the form.
$(document).ready(function(){
$("#create_user_form").submit(function(e){
e.preventDefault(); //do not submit the form.
var serialize = $(this).serialize();
alert('Here');
$.post("create_user.php",serialize,function(response){
alert('Here2');
alert(response);
console.log("Response: "+response);
});
});
});
I populate a list of <form> using a PHP while loop, and fill the fields with values from MySQL. Now I want to be able to update all forms with one submit- button.
The form looks something like this in HTML (note, on my actual page there are multiple like this. The only thing that differes is the <form id='X'>:
<form id='34' name='customercontact' method='post' action='customerUpdate.php'>
Förnamn: <br /><input type='text' name='contact_firstname' class='textbox' value='text....'>
Efternamn: <br /><input type='text' name='contact_lastname' class='textbox' value='text....'>
Telefonnummer: <br /><input type='text' name='contact_phone' class='textbox' value='text....'>
Mobiltelefon: <br /><input type='text' name='contact_cellphone' class='textbox' value='text....'>
E-mail: <br /><input type='text' name='contact_email' class='textbox' value='text....'>
<select name='isActive'>
<option value="0" selected>Inaktiv</option>
<option value="1">Aktiv</option>
</select>
</form>
How do I use jQuery serialize to send each form and all the values as a string? I don'r really know where to start.
You can select all forms on the page $('form') and then iterate through them and 'submit' values via AJAX.
UPDATE:
<script type="text/javascript">
$(document).ready(function() {
$('#customer_contact_save').live('click', function(e){
e.preventDefault(); // prevent form submit
$.each($('form'), function(index) {
var sData = $(this).serialize(); // get data from form for submit
$.ajax({
type: "POST",// path to php script that saves data to db
url: "some.php",
data: sData,
success: function(someMessageFromPhp) {
alert(someMessageFromPhp); // alert to user what some.php returned
}
});
});
});
});
</script>
Currently i have a form which has an image as a submit. It works fine as in the form variables get passed through and gets processed. However, the page gets refreshed every time click submit for the form since the processing page has a header back to the form page.
I need a way to send the form variables without the refreshing. I understand it can be done via ajax. However, i am facing a prob since my submit button is an image. Any help as to how i can rectify my code to submit the form without refresh would be great
<form name ="nominate" action="" id ="nominate" method="POST">
<input type="hidden" name="id" value="<?php echo $id;?>">
<input type="hidden" name="screenName" value="<?php echo $author;?>">
<input type="hidden" name="course" value="<?php echo $course;?>">
//this is the image submit button
<input type="image" style="float: left;" onMouseOver="this.src='images/nominated.png'"
onMouseOut="this.src='images/nominate.png'" value="Place Order" src="images/nominate.png" width="60" height="20">
</form>
<script>
$(function() {
$(".button").click(function() {
var id = $("#id").val();
var screenName = $("#screenName").val();
var dataString = 'id='+ id + '&screenName=' + screenName + '&course=' + course;
alert (dataString);
$.ajax({
type: "POST",
url: "nominate.php",
data: dataString,
success: function(){
alert(dataString);
}
});
});
});
</script>
The code you've done should work, if you add the class of "button" to the image.
<input type="image" class="button"....
Firstly you need to add the id attribute as in jquery $("#") is the id of the element.
<input type="hidden" name="id" id="id" value="<?php echo $id;?>">
<input type="hidden" name="screenName" id="screenName" value="<?php echo $author;?>">
<input type="hidden" name="course" id="course" value="<?php echo $course;?>">
Then as said by Andrew either add the class="button" or use $("#some_id") and then give the button input an id="some_id".
$(".button").click(function(){
var url = "nominate.php";
var id = $("#id").val();
var screenName = $("#screenName").val();
var course = $("#course").val();
$.post(url,{id:id, screenName:screenName , course:course }, function(data){
alert(data);
});
});
This will alert whatever you send back from "nominate.php". Make sure you remove the header() from the script and send back a success or error message possibly.
Add the class 'button' to your image.
Also, you don't seem to have course defined anywhere. You might want to fix that, too.