I have looked at some other question regarding sending javascript arrays to php so save the data in database.
<form action="insert.php" method="POST">
<input type='submit' id="save" value='Spara' onclick='sendFunc()'>
<script>
var rad = [0,0,0,0,0,0,0,0,0,0,0,0,0];
function sendFunc() {
$.ajax({
url: "/insert.php",
type: "POST",
data: {myArray : rad}
});
}
</script>
</form>
}
and in insert.php
<?php
$array = $_POST['myArray'];
echo $array;
?>
i did expect to see my array rad on the insert page.
What did i do wrong?
Try to add preventDefault and close your brackets properly:
function sendFunc(e) {
e.preventDefault();
$.ajax({
url: "/insert.php",
type: "POST",
data: {myArray : rad}
});
}
You need to prevent from refreshing page by return false on your click function ...
<form action="insert.php" method="POST">
<input type='submit' id="save" value='Spara' onclick='return sendFunc();'>
<script>
var rad = [0,0,0,0,0,0,0,0,0,0,0,0,0];
function sendFunc() {
$.ajax({
url: "/insert.php",
type: "POST",
data: {myArray : rad}
});
return false;
}
</script>
</form>
required jquery.js
$(document).ready(function(){
$("#save").on("click",function(e){
e.preventDefault();
$.ajax({
url: "/insert.php",
type: "POST",
data: {myArray : rad}
});
}).done(function(data){
$("body").html(data);
});
})
or you can edit your function()
function sendFunc() {
$.ajax({
url: "/insert.php",
type: "POST",
data: {myArray : rad}
}).done(function(data){
$("body").html(data);
});
return false;
}
Related
I'm having trouble getting an ajax-loaded form (#ajaxLoadedForm) to submit via ajax. The formData object gathers no data. I figure I've got to attach an event-handler to the form so the DOM recognizes it, but I can't figure out how.
A couple of notes: I'm bypassing the 'submit' method and using a button (#button), so I can't attach the handler to that. The form itself is a sibling to #button, not a child.
<form id="ajaxLoadedForm" enctype="multipart/form-data" action="destination.php" method="POST">
<input type="hidden" name="state" value="1" />
<label for="fullname">Your Full Name</label>
<input type="text" id="name" autocapitalize="off" autocorrect="off" name="fullname" placeholder="your name" value="" />
</form>
<div id="button">Submit me!</div>
$('#button').click(function(){
var uploadData = new FormData($("#ajaxLoadedForm")[0]);
jQuery.ajax({
url: 'destination.php',
data: uploadData,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
data = JSON.parse(data);
if (data['pass'] == false) {
console.log('fail');
} else {
console.log('success');
}
}
});
});
Try using the submit handler on the form itself
$('#ajaxLoadedForm').submit(function(e){
e.preventDefault();
var uploadData = new FormData(this);
});
Then make your button for submit a submit type
<button type='submit'>Submit</button>
In your php side, test the data coming by doing this:
print_r($_POST);
you can use serialize function for sending form data . Like below
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script >
$('#button').click(function(){
var uploadData = $('#ajaxLoadedForm').serialize();
jQuery.ajax({
url: 'destination.php',
data: uploadData,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
data = JSON.parse(data);
if (data['pass'] == false) {
console.log('fail');
} else {
console.log('success');
}
}
});
});
</script>
Try below code..
$('#button').click(function(){
var uploadData = new FormData();
uploadData.append('fullName',$('#fullName').val());
jQuery.ajax({
url: 'destination.php',
data: uploadData,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
}
});
});
And try to access full name in php
POST method return undefined value, but GET method working fine. I even tried $.post(url, data, success); << $.post even worse GET and POST can't work.
<input type="submit" value="submit" id="btnUpload">
$('#btnUpload').click(function(){
$.ajax({
type: 'POST',
url: 'ajax.php',
data: { 'action': 'scan_email' },
success: function(response) {
alert(response);
}
});
ajax.php
<?php echo $_POST['action'];?>
Use method instead of type:
Code:
<input type="submit" value="submit" id="btnUpload">
$('#btnUpload').click(function(){
$.ajax({
method: 'POST',
url: 'ajax.php',
data: { 'action': 'scan_email' },
success: function(response) {
alert(response);
}
});
Added the jquery library
<input type="button" value="submit" id="btnUpload">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#btnUpload').on('click', function(){
$.ajax({
type: "POST",
url: "login.php",
data: { 'action':'scan_email'},
success: function(theResponse) {
// Output from ajax.php
alert(theResponse); // comment this
}
});
});
});
</script>
I am new to PHP and AJAX, I do not get any mail on this
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js">
function trigger() {
$.ajax({
type: "POST",
url: 'images/mail.php',
data: datastring,
});
}
</script>
Try this:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js">
<script>
function trigger() {
$.ajax({
type: "POST",
url: 'images/mail.php',
data: datastring,
});
}
</script>
I have a problem on ajax call.
Here is my code regarding the ajax:
$('#Subjects').click(function() {
$.ajax({
type: 'POST',
url: '../portal/curriculum.php',
data: 'studentNumber='+$('#StudentID').val(),
success: function(data)
{
$('#curriculum').html(data);
}
});
});
When I echo studentNumber on another page, the studentNumber is undefined. Why is that?
Simply modify your code like this:
JS
$('#Subjects').click(function() {
$.ajax({
type: 'POST',
url: '../portal/curriculum.php',
data: { studentNumber: $('#StudentID').val() },
success: function(data)
{
$('#curriculum').html(data);
}
});
});
PHP
<?php
$var = $_POST['studentNumber'];
?>
If you still can not make it works.. other things you should consider..
url: '../portal/curriculum.php',
1) Please use full URL http://yourdomain.com/portal/curriculum.php or absolute path like /portal/curriculum.php
2) Add an error callback to check out the error message
$('#Subjects').click(function() {
$.ajax({
type: 'POST',
url: '../portal/curriculum.php',
data: { studentNumber: $('#StudentID').val() },
success: function(data)
{
$('#curriculum').html(data);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
});
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.post("test1.php",
{
name: "Makemelive Technologies",
city: "Mumbai"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
});
</script>
</head>
<body>
<button>Send an HTTP POST request to a page and get the result back</button>
</body>
</html>
The above will make a call to test1.php and its code will be
<?php
$fname=$_REQUEST['name'];
$city= $_REQUEST['city'];
echo "Company Name is ". $fname. " and it's located in ". $city ;
?>
$('#Subjects').click(function() {
$.ajax({
type: 'POST',
url: '../portal/curriculum.php',
data: { studentNumber: $('#StudentID').val() },
success: function(data)
{
//here data is means the out put from the php file it is not $('#StudentID').val()
$('#curriculum').html(data);
}
});
});
as exsample if you echo some text on php it will return with data $('#curriculum').html(data);
try to change
//change
success: function(data)
{
$('#curriculum').html(data);
//to
success: function(result)
{
$('#curriculum').html(result);
check what will happen.
post us php file too curriculum.php
You can use through Jquery,Ajax and php
step 1. index.php
<div id="div_body_users">
</div>
<form method="post" id="frm_data" action="">
<input type="button" id="target" name="submit" value="submit">
<input type="key" id="key" name="key" value="1234">
</form>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
$(document).ready(function(){
$( "#target" ).click(function() {
// alert("test");
var frm_mail = document.getElementById("frm_data");
var frm_mail_data = new FormData(frm_mail);
$.ajax({
url: "http://localhost/test.php",
data: frm_mail_data,
cache: false,
processData: false,
contentType: false,
type: 'POST',
success: function (result) {
document.getElementById('div_body_users').innerHTML=result;
}
});
});
});
</script>
step 2. create test.php
<?PHP
//print_r($_POST);
if($_POST['key']=='1234'){
echo "success";
exit(0);
}
?>
$.ajax({
type: "GET",
url: "view/logintmp.php?username="+username+"&password="+password,
}).done(function( msg ) {
var retval = printmsgs(msg,'error_success_msgs');
if(retval==1){
window.location.href='./';
}
});
Form is not submit using ajax.form submit on click li. Give me some solution
My js code is here
$(document).ready(function(){
$('#sortable li').click(function() {
$("#frmgallery").submit(function(event) {
event.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
});
});
});
HTML is here
<form method="post" enctype="multipart/form-data" id="frmgallery" name="gallery" action="<?php get_template_directory();?>admin.php?page=gallery/gallery.php">
<ul id="sortable">
Query
<li class="ui-state-default" name='liindex' id="<?php echo $row['glryRecordId'];?>" >
<span style="display:none"><?php echo $row['glryRecordId'];?></span>
<img class='thumbnail' alt='' src='<?php echo get_site_url();?>/wp-content/themes/townsley/upload/<?php echo $row['glryName']; ?>' width='80' height='60'
style="border: 1px solid #D3D3D3;padding:2px;"/><input type="hidden" value="<?php echo $row['glryRecordId'];?>" name="recordId[]" />
Remove
</li>
</ul>
</form>
Please help me
Thanks
ajax jquery javascript
You should provide your HTML too in your question, but as far as i can see, you have event in event callbacks with actually nothing to initiate the submit event. So basically you should consider something like this :
$(document).ready(function(){
$('#sortable li').click(function() {
event.preventDefault();
var formdata = $("#frmgallery").serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
});
});
});
You can use the ajaxForm/ajaxSubmit functions from Ajax Form Plugin or the jQuery serialize function.
Example:
$("#frmgallery").ajaxForm({url: 'gallery.php', type: 'post'})
or
$("#frmgallery").ajaxSubmit({url: 'gallery.php', type: 'post'})
ajaxForm will send when the submit button is pressed. ajaxSubmit sends immediately.
Have you tried return false at the end of your submit function?
$("#frmgallery").submit(function(e) {
e.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
error: function(){alert('error');}
});
return false;
});
$('#sortable li').click(function() {
$("#frmgallery").submit();
});
Also post what you get from $.ajaxcall
$("#frmgallery").ajaxForm({url: 'gallery.php', type: 'post'})
Have you tried return false at the end of your submit function?
$("#frmgallery").submit(function(e) {
e.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
error: function(){alert('error');}
});
return false;
});
$('#sortable li').click(function() {
$("#frmgallery").submit();
});