Strange behaviour with jQuery.ajax - php

I've suddenly gotten a very strange "bug". Up to now, this script has worked like a charm. But all of the sudden the formData variable is not passed through jQuery.ajax, as if it does not exist.
The funny thing is that if I trigger an alert displaying the data, it all works. But as soon as I remove the alert, the php script tells me that formData index is missing.
I'm clueless to what causes this or how to solve it :-/
This works fine on my development server, but not on the production server.
jQuery('#btn_saveForm').live('click', function() {
var instance = 'update';
var brand_id = jQuery('#itemID').val();
// Get form data
var form_data = jQuery("#data_form").serialize();
// alert(form_data); //If I uncomment this, the script works...
//Process form data
jQuery.ajax({
url: siteURL +"/wp-content/themes/my_theme/include/jquery.php",
data: {
instance : instance,
formData : form_data,
brandID : brand_id
},
success: (function(feedback) {
showFeedback(feedback);
}),
dataType: 'json'
});
});

My guess would be that putting the alert() in allows the form_data and brand_id variables to be filled completely before the AJAX request is sent. With that in mind, try this:
jQuery.ajax({
url: siteURL +"/wp-content/themes/my_theme/include/jquery.php",
data: {
instance : instance,
formData : jQuery("#data_form").serialize(),
brandID : jQuery('#itemID').val()
},
success: (function(feedback) {
showFeedback(feedback);
}),
dataType: 'json'
});
Alternatively, just to test, you could set async: false on the AJAX call to see if that makes a difference.

try to restart browser / change browser to another and see whats happening then

If it's true that you have some races here (which would be very strange, as js is single-threaded), the following should help you:
setTimeout(function() {
jQuery.ajax({
url: siteURL +"/wp-content/themes/my_theme/include/jquery.php",
data: {
instance : instance,
formData : form_data,
brandID : brand_id
},
success: (function(feedback) {
showFeedback(feedback);
}),
dataType: 'json'
})
}, 0);
The 0-timeout construction will put your code at the end of execution queue.

Related

Prevent AJAX calls from firing twice everytime

I am building a web application using JQuery 3.3.1. It would seem that everytime I make ajax call, the request is sent twice. I can tell because I tried logging the requests on server side. I tried solutions from similar questions but they do not seem to help.
I separated the ajax call from click events, so it does not happen because of click event being registered twice.
$(function() {
console.log("hi");
var request = {};
request["user_id"] = 1;
request["date"] = new Date();
request["assignments"] = [{
"point_count" : 1,
"skill_mnemo" : "SKILL_FARM"
}];
$.ajax({
type: "POST",
dataType: "json",
mimeType: "application/json",
url: "./api/update_skill_point.php",
enctype: 'multipart/form-data',
data: request,
async: false,
cache: false,
success: function(result) {
console.log(result);
}
});
});
You have to debug this code by the following ways:
Check how many times hii is printing into console.
Add break point at start of $.ajax. Then check the call stack.
Check into network tab and analyse the call stack at initiator column for the corresponding ajax call.(for Chrome)
Hope it will help for you.
There is a chance that the submit button in your form is NOT set to type="button".
So, on-clicking the button, your ajax function runs and the browser also attempts to submit the form (default behavior of submit buttons) to your current URL. This might give the appearance that ajax is being called twice.
don't use
(function(){})
if we use (function(){}), it will call itself when DOM is getting ready and then again when required.
Try
function ajaxCall()
{
console.log("hi");
var request = {};
request["user_id"] = 1;
request["date"] = new Date();
request["assignments"] = [{
"point_count" : 1,
"skill_mnemo" : "SKILL_FARM"
}];
$.ajax({
type: "POST",
dataType: "json",
mimeType: "application/json",
url: "./api/update_skill_point.php",
enctype: 'multipart/form-data',
data: request,
async: false,
cache: false,
success: function(result) {
console.log(result);
}
});
}
$(document).ready(){
ajaxCall();
}
In this way you can control your ajax call,
Now you might have some idea how to deal, if not let me know, I'll try to explain more.

ajax post to php returns an empty array

I have been stuck for some time on passing some data from ajax to php. All works fine until I go to grab the data with php. Nothing is there but an empty array. I have tried a few different ways to resolve this and have not been successful at all. It seems a simple task has turned into a major problem for me
var canvas = document.getElementById("signature");
var ImgData = document.getElementById("Image").value = canvas.toDataURL('image/jpeg');
console.log(ImgData);
$.ajax({
url: 'upload.php',
type: 'POST',
dataType : "text",
contentType: "multipart/form-data; charset=UTF-8",
data: {'Image' : ImgData},
success: function(data) {
console.log("sucessful send:");
console.log(data);
},
error: function(d) {
console.log('error');
console.log(d);
console.log(d.responseText);
}
});
And my php I have put for testing for now
print_r($_POST);
exit;
img = $_POST['Image'];
As I was getting an Undefined Index error with php. So I set it to print_r() to see what was going on in the console
The console data shows everything is great until I grab the POSTed data and output it to see whats in it. And the array always has no value.
"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/2wBDAQMDAwQDBAgEBAgQCwkLEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBD/wAARCACWAu4DAREAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD8qqACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKACgAoAKAP//Z" ajaxsend.js:41:3
POST XHR http://example.com/upload.php [HTTP/1.1 200 OK 313ms]
sucessful send: ajaxsend.js:57:11
Array
(
)
I have also tried getting the canvas in a different fashion as well suggested by someone else such as
var pngImage = new FormData();
pngImage.append('Image', $('#signature')[0].toDataURL('image/jpeg'));
$.ajax({
url: 'upload.php',
type: 'POST',
dataType : "text",
contentType: "multipart/form-data; charset=UTF-8",
data: {'Image': $('#signature')[0].toDataURL('image/jpeg')},
And the same result happens. It sends fine but returns an empty array to php. I have also set contentType to a variety of different things to see if this was interfering with how the data was received. Nothing helped at all. I am also using signature pad 2.3.0 from github as the canvas
UPDATE:
Thanks to #Phil and his advice I have changed the code to
var canvas = document.getElementById("signature");
var ImgData = document.getElementById("Image").value canvas.toDataURL('image/jpeg');
console.log(ImgData);
$.ajax({
url: 'upload.php',
type: 'POST',
dataType : "text",
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
data: {'Image' : ImgData},
success: function(data) {
console.log("sucessful send:");
console.log(data);
},
error: function(d) {
console.log('error');
console.log(d);
console.log(d.responseText);
}
});
ajax timesout trying to send however when testing with plain text and changing
data: {"Image" : "Testing"},
its sends just fine. I am suspecting it is something to do with the image being sent. Am I not passing the canvas correctly to ajax or is there something I am doing incorrect?

CORS Ajax POST variables empty in live server but work in local server

After days (and a bit of spamming here and there), I did get CORS to work for my CodeIgniter applications. However, POST variables are empty in the PHP side in live server. the whole $_POST array is empty for some reason. Here is my ajax code:
var postForm = {'e':'sammy'}; //data to process
$.ajax({
type: "POST",
url: "http://www.abc.ca/types/add",
data: postForm,
dataType : "json",
cache: "false",
contentType: "application/json",
success: function (result) {
//result here is blank
alert(result);
},
fail: function (result){
alert(result);
}
});
and the called php function (without the whole controller class):
function add() {
//Add new a biz type
file_put_contents('trial.txt',implode(" | ",$_POST));
echo $this->input->post('e');
}
Am I missing something? the response from server are ok. but still the file created contains no data and echo prints empty. Any tips please? I have already tried method:'POST' instead of type:'POST'. Get variables pass away successfully.
Is this CI issue or Ajax because it is constant across ff,chrome and Opera
Try This Ajax :
$.ajax({
type: "POST",
url: "http://www.abc.ca/types/add",
data: postForm,
cache: "false",
success: function (result) {
//result here is blank
alert(result);
},
fail: function (result){
alert(result);
}
});

Ajax post not appending data to URL

I am trying to get my search bar working, however I am having issues with an ajax post.
For whatever reason, none of the data is being appended to the URL. I have tried various things with no success. I am attempting to send the data to the same page (index.php).
Here is my jquery:
$(function(){
$(document).on({
click: function () {
var tables = document.getElementsByTagName("TABLE");
for (var i = tables.length-1; i >= 0; i-= 1) {
if (tables[i]) tables[i].parentNode.removeChild(tables[i]);
}
var text = $('#searchBar').val();
var postData = JSON.stringify({ searchTerm: text });
$.ajax({
type: 'POST',
url: 'index.php',
dataType: 'json',
data: postData,
success: function() {
alert("Test");
}
});
}
}, "#searchButton");
});
And here is the php which I have with index.php:
<?php
require('course.php');
if(isset($_POST['searchTerm'])) {
echo $_POST['searchTerm'];
}
?>
No matter what I try, I am unable to get anything to post. I have checked the network tab in chrome, and I'm not seeing anything that indicates it's working correctly.
Any ideas?
EDIT:
I've changed my code to this, and it seems I'm getting closer:
$(document).on({
click: function () {
$("TABLE").remove()
var text = $('#searchBar').val();
$.ajax({
type: 'GET',
url: 'index.php',
dataType: 'text',
data: { searchTerm: text },
success: function() {
alert("Test");
}
});
}
}, "#searchButton");
And:
<?php
require('course.php');
if(isset($_GET['searchTerm'])) {
echo $_GET['searchTerm'];
}
?>
Now I am getting ?searchTerm=theTextIEnter as expected, however it's still not being echoed in index.php.
Do not use JSON.stringify() to convert object to string. data passed to $.ajax must be an object and not JSON.
For whatever reason, none of the data is being appended to the URL.
You are making a POST request. POST data is sent in the request body, not in the query string component of the URL.
If you change it to a GET request (and inspect it in the correct place, i.e. the Network tab of your browser's developer tools and not the address bar for the browser) then you would see the data in the query string.
This will work for you use data: { postData } on place of data:postData and you will receive your data in $_POST['postData']
$(function(){
$(document).on({
click: function () {
var tables = document.getElementsByTagName("TABLE");
for (var i = tables.length-1; i >= 0; i-= 1) {
if (tables[i]) tables[i].parentNode.removeChild(tables[i]);
}
var text = $('#searchBar').val();
var postData = JSON.stringify({ 'searchTerm' : text });
$.ajax({
type: 'POST',
url: 'index.php',
dataType: 'json',
data: { postData },
success: function(data) {
alert(data.searchTerm);
}
});
}
}, "#searchButton");
});
In index.php
<?php
if(isset($_POST['postData'])) {
echo $_POST['postData'];
die;
}
?>
If you want to send data via the URL you have to use a GET request. To do this, change the type of the request to GET and give the object directly to the data parameter in your jQuery, and use $_GET instead of $_POST in your PHP.
Finally note that you're not returning JSON - you're returning text. If you want to return JSON, use json_encode and get the value in the parameter of the success handler function.
Try this:
$(document).on({
click: function () {
$('table').remove();
$.ajax({
type: 'GET',
url: 'index.php',
dataType: 'json',
data: { searchTerm: $('#searchBar').val() },
success: function(response) {
console.log(response.searchTerm);
}
});
}
}, "#searchButton");
<?php
require('course.php');
if(isset($_GET['searchTerm'])) {
echo json_encode(array('searchTerm' => $_GET['searchTerm']));
}
?>
Remove dataType: 'json', from your AJAX. That is all.
Your response type is not JSON, yet by setting dataType: 'json' you're implying that it is. So when no JSON is detected in the response, nothing gets sent back to the method handler. By removing dataType it allows the API to make an educated decision on what the response type is going to be, based on the data you're returning in the response. Otherwise, you can set dataType to 'text' or 'html' and it will work.
From the manual:
dataType: The type of data that you're expecting back from the server.
This is NOT the type of data you're sending/posting, it's what you're expecting back. And in your index.php file you're not sending back any JSON. This is why the success() method is not satisfying. Always set the dataType to the type of data you're expecting back in the response.
With POST Request:
Please comment below line in your code:
//var postData = JSON.stringify({ searchTerm: text });
And use below ajax code to get the post-data:
$.ajax({
type: 'POST',
url: 'index.php',
dataType: 'json',
data: { searchTerm: text },
success: function() {
alert("Test");
}
});
With GET Request:
You can convert your data to query string parameters and pass them along to the server that way.
$.ajax({
type: 'GET',
url: 'index.php?searchTerm='+text,
dataType: 'json',
success: function(response) {
alert(response);
}
});
In response, You can get the data with alert, so you may get idea about the same.

Jquery Ajax not working on IE

I got very strange bug on IE. I used the code below to make a ajax request to get data from database and create drop down option <option> with that data. The thing is on IE the data didn't appear properly, it's only showing first character of data, but on other browser the data are showing correctly. I tried printing out the data as well, data are correct.
So I suspected either of my Jquery selection or append is wrong and tried appending outside the ajax call with some junk data and data are showing correctly but then again I put that code inside the ajax and its not showing again... I really out of clue now.. Can you guy plz help me with this? I have tested with FF, Chrome and safari they all working fine...
$.ajax({
cache: false,
type: "POST",
url: "<?php echo $this->baseUrl(); ?>/rewards/getdiscounttype/",
data: { esid: estore_id }
}).done(function( data ) {
var obj = jQuery.parseJSON(data);
jQuery.each(obj, function (i, app) {
//alert(i+app['discount_type']);
var sel = $('select[name=discount_type'+id+']');
sel.append('<option value="'+app['id']+'">'+app['discount_type']+'</option>');
});
});
$.ajax({
cache: false,
type: "POST",
url: "<?php echo $this->baseUrl(); ?>/rewards/getdiscounttype/",
data: { esid: estore_id },
datatype: "json",
succes: function(jsonData){
$.each(jsonData,function(i,app){
var sel = $('select[name=discount_type'+i+']');
sel.append('<option value="'+app.id.+'">'+app.discount_type.+'</option>');
});
},
error: function(e){
}
})
Try this, and I think its better to treat JSON as objects like app.id in stead of app['id']. Haven't had much time to do some testing, Ive you would give me the json you receive I can test.
Working now with JavaScript!
$.ajax({
cache: false,
type: "POST",
url: "<?php echo $this->baseUrl(); ?>/rewards/getdiscounttype/",
data: { esid: estore_id }
}).done(function( data ) {
var obj = jQuery.parseJSON(data);
/* clearing options with JS since jQuery cleare the select in the DOM but enter code herenot on screen. */
$('select[name=discount_type'+id+']')[0].options.length = 0;
$('select[name=discount_type'+id+']').children().remove().end().append('');
jQuery.each(obj, function (i, app) {
var sel = $('select[name=discount_type'+id+']');
sel.append('<option value="'+app.id+'">'+app.discount_type+'</option>');
});
});

Categories