I have a form with allows the user to edit data in the database using Ajax and ASP. Not sure why the ajax call is not updating the database as requested.
AJAX/jQuery code:
$('#editbtn').click(function(){
var thisid = $('#edsid').val();
var enm = $('#edtName').val();
var eml = $('#edtEmail').val();
var egp = $('#editSubForm input[name=edgrp]').val();
var dataString = 'act=upd&sid=' + thisid + '&edName='+ enm + '&edEmail='+ eml + '&edgrp='+ egp;
$.ajax({
type: 'GET',
url: '/subscr_query.asp',
data: dataString,
success: function(){
//alert(dataString);
$('#successmsg').append("Edited!");
$('#successmsg').fadeIn(1200, function(){$(this).fadeOut(2000);});
},
error: function(){
$('#delpop').fadeIn(300);
}
});
});
The form contains a submit button with the id "editbtn". Form seems to process with out the database getting update with the current information.
I've tested the queryString on the subscr_query.asp page by entering the data that gets outputted from the form to the page directly, and db updated as expected.
Any ideas?
I'm suspecting you're not preventing the default action; hence, it's submitting the form before performing the ajax request. Use preventDefault
$('#editbtn').click(function(e){
var thisid = $('#edsid').val();
var enm = $('#edtName').val();
var eml = $('#edtEmail').val();
var egp = $('#editSubForm input[name=edgrp]').val();
var dataString = 'act=upd&sid=' + thisid + '&edName='+ enm + '&edEmail='+ eml + '&edgrp='+ egp;
$.ajax({
type: 'GET',
url: '/subscr_query.asp',
data: dataString,
success: function(){
//alert(dataString);
$('#successmsg').append("Edited!");
$('#successmsg').fadeIn(1200, function(){$(this).fadeOut(2000);});
},
error: function(){
$('#delpop').fadeIn(300);
}
});
e.preventDefault(); // prevent default action
});
Related
I want to clear my previous ajax response images before appending new images please help me how can i do that ? thank u.
Ajax
<script>
$(document).ready(function(){
var preloaded = [];
$(document).on('click','.editBtn',function(){
var marchandiseId = $(this).data("id");
var file ="{{Config('wfh.file')}}";
$(".input-images-edit").empty();
$("#editModel").modal('show');
var url = "{{URL('/marchandise/edit/')}}";
$.ajax({
type:"GET",
url: url + '/' + marchandiseId,
dataType:'JSON',
success:function (response){
var data = response.marchandise.marchandise_details;
$.each(data, function(i, item) {
preloaded.push({id: item.id, src: file + '' + item.images });
});
$('.input-images-edit').imageUploader({
preloaded: preloaded,
imagesInputName: 'photos',
preloadedInputName: 'old'
});
}
});
});
http://jsfiddle.net/pdb26p3q/22/
$(".verify").click(function () {
var ID = $(this).attr('id');
var dataString = 'verify=' + ID;
$.ajax({
type: "POST",
url: "",
data: dataString,
cache: false,
success: function () {
$(".code").show('slow');
}
});
});
I have tried using my own server and is not working too
I'm not sure what is the problem, sorry Im quite near to jquery
Edited: The .code(input) is not showing. Because if submit successfully the input will be shown.
you can try like
var dataString = {verify:ID};
Still stack in these code. On any browser desktop working fine, but when try use chrome on my android, can't post value from ajax datastring.
jQuery(document).ready(function()
{
jQuery(".button").click(function()
{
var product = jQuery(".products").val().split('|')[0];
var nomortujuan = jQuery(".nomortujuan").val();
var pn = parseFloat(document.getElementById("val[pin]").value);
var dataString = 'method=sendMessage&message='+product+'.'+ nomortujuan+'.'+pn;
var web = 'ajax.php';
jQuery.ajax ({
type: "POST",
url: web,
data: dataString,
cache: true,
beforeSend: function(html) {
document.getElementById("hasil").innerHTML = '';
jQuery(".flash").show();
jQuery(".flash").html('<div style="float:left;"></div>');
},
success: function(html){
jQuery("#js_process_request input, #js_process_request select").attr('disabled',false);
jQuery(".flash").hide();
jQuery("#hasil").hide();
jQuery ("#hasil").append(html);
return false;
}
});
});
});
Maybe this problem
jQuery ("#hasil").append(html);
remove spacing to fix it
jQuery("#hasil").append(html);
sorry for this request but I'm an AJAX beginner.
I have the following script and I'm trying to animate it (something like "fade").
jQuery(document).ready(function($){
$(document).on("click",".ratingemo", function(){
var rating = $(this).attr("id").substr(0, 1);
var id = $(this).attr("id").substr(1);
var data = "id="+id+"&rating="+rating;
$.ajax({
type: "POST",
url: "/ldplug/rate.php",
data: data,
success: function(e){
$("#r"+id).html(e);
}
})
});
});
How can I do that?
Many thanks!
First of all live is deprecated, check out on instead. But that being said, why not:
success: function(e){
$("#r"+id).hide();
$("#r"+id).html(e).fadeIn("slow");
}
It would be better to just have $("#r"+id) hidden to start, I just hid it to illustrate the point.
Without seeing your HTML, I have to assume that something like this will work for you. Hide the element, populate it, then fade it in.
jQuery(document).ready(function ($) {
$(".ratings").live("click", function () {
var rating = $(this).attr("id").substr(0, 1);
var id = $(this).attr("id").substr(1);
var data = "id=" + id + "&rating=" + rating;
$("#r" + id).hide();
$.ajax({
type: "POST",
url: "/ratings/rate.php",
data: data,
success: function (e) {
$("#r" + id).html(e);
$("#r" + id).fadeIn();
}
})
});
});
This is the ajax code for the form submission:
$('form[class^="ajaxsubmit_"]').live('submit', function(e){
e.preventDefault();
var classname = $(this).attr('class');
var classnamesplit = classname.split("_");
var container = classnamesplit[1];
if (container == 'parent'){
container = $(this).parent();
}
$(container).show();
$(container).html('<img src="public/images/web/ajax.gif"/>');
$(this).ajaxSubmit(container);
});
(function($){
jQuery.fn.ajaxSubmit =
function(container) {
var url = $(this).attr('action');
$.ajax({
url: url,
type: "POST",
data: $(this).serialize(),
dataType: "html",
success: function(msg) {
$(container).html(msg);
}
});
return this;
};
})(jQuery);
This is like a general function for all forms, it reads the action and sends the data to it. Then outputs in the parent or the specified div. It works perfectly fine in Chrome, Firefox and Opera. How can I solve this?