I have one dropdown for displaying the month from January to current month in jQuery mobile. I'm getting the data using JSON. But the problem is selected option is not getting refresh.
$.ajax({
type: "POST",
url: "../modules/loadmonth.php?id=getoption&studid=" + $('#studentids').val(),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
$.each(data, function (i, item) {
var sel;
if (date[i].optval == date[i].curmon) {
sel = "selected";
} else {
sel = "";
}
result = '<option value=' + data[i].optval + '' + sel + '>' + data[i].opt + '</option>';
});
$('#getmon').append(result);
}
});
The value attribute should be in quotes, but more importantly you'll need a space between it and your selected attribute.
I have added selectmenu after append then it works.
$.ajax({
type: "POST",
url: "../modules/loadmonth.php?id=getoption&studid=" + $('#studentids').val(),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
$.each(data, function (i, item) {
var sel;
if (date[i].optval == date[i].curmon) {
sel = "selected";
} else {
sel = "";
}
result = '<option value=' + data[i].optval + '' + sel + '>' + data[i].opt + '</option>';
});
$('#getmon').append(result).selectmenu('refresh',true);
}
});
Related
I want to show total no. of post in blogger with ajax get method bellow is my code.
<div id='show'></div>
<script type="text/javascript">
$.ajax({
url: "https://techtovillage.blogspot.com/feeds/posts/default?orderby=published&max-results=10&start-index=2&alt=json-in-script",
type: "get",
dataType: "jsonp",
success: function (data) {
var Posts = '<div class="hindipathtestapp">';
for (var i = 0; i < data.feed.entry.length; i++) {
var totalposts = json.feed.openSearch$totalResults.$t;
var posttitle = data.feed.entry[i].title.$t;
var postcontent = data.feed.entry[i].content.$t;
Posts += "<div class='testapp'><h1>" + totalposts + "</h1><h3>" + posttitle + "</h3><div class='content'>" + postcontent + "</div></div>";
}
Posts += "</div>"
document.getElementById('show').innerHTML = Posts;
}
});
</script>
Try this
<div id='show'></div>
<script type="text/javascript">
$.ajax({
url: "https://techtovillage.blogspot.com/feeds/posts/default?alt=json-in-script",
type: "get",
dataType: "jsonp",
success: function (data) {
var totalposts = data.feed.openSearch$totalResults.$t;
document.getElementById('show').innerHTML = "<div class='totalposts'>" + totalposts + "</div>";
}
});
</script>
I have a json array:
[{"value": "1"},{"value": "2"},{"value": "3"},{"value": "4"},{"value": "5"},{"value": "6"}]
My code is :
$.ajax({
url: "120.58.243.11:8080/needCal/myJson.json",
dataType: 'json',
success: function(data) {
var items = [];
$.each(data, function(key, value) {
items.push("<tr>");
items.push("<td id=''" + key + "''>" + value.value+ < /td>");
items.push("<td id=''" + key + "''>" + total of values + < /td>");
items.push("</tr>");
});
}
});
I want to calculate the values, how to do with that?
$.ajax({
url: "120.58.243.11:8080/needCal/myJson.json",
dataType:'json',
success: function(data){
var items = [];
var totalOfValue = 0;
$.each(data,function(key,value){
totalOfValue = totalOfValue + parseInt(value.value);
});
$.each(data,function(key,value){
items.push("<tr>");
items.push("<td id='" +key+ "'>" + value.value+</td>");
items.push("<td id='" +key+ "'>" + totalOfValue +</td>");
items.push("</tr>");
});
}
}
);
A simple way is to use the reduce method:
Something like this:
var total = arr.reduce(function(t, v) {
return t += Number(v.value);
}, 0);
I am generating dynamic html textboxes in my aspx page. I add a button for do some functionality. now whenever I click on my button it post back and all the dynamic generated textboxes go from my form for this I have to add it again. But I want to maintain these textboxes after postback. Here is the code how i am generating textboxes
<script type="text/javascript">
var textid = null;
var textid1 = null;
$(document).ready(function () {
setupAutoComplete(textid);
setupAutoComplete1(textid1);
var counter = 2;
$("#addButton").click(function () {
if (counter > 5) {
alert("Limit Exceeds");
return false;
}
var newTextBoxDiv = $(document.createElement('div'))
.attr("id", 'TextBoxDiv' + counter);
textid = "textbox" + counter;
textid1 = "textbox" + counter+1;
// newTextBoxDiv.after().html('<label>Textbox #' + counter + ' : </label>' +
// '<input type="text" name="textbox' + counter +
// '" id="textbox' + counter + '" value="" class="auto">');
newTextBoxDiv.after().html('<div class="fields-left"><label> Leaving from</label><input type="text" name="textbox' + counter + '" id="textbox' + counter + '" class="auto"/> </div><div class="fields-right"> <label> Going to</label> <input type="text" name="textbox' + counter + '" id="textbox' + counter + 1 + '" class="auto"/> </div>');
newTextBoxDiv.appendTo("#TextBoxesGroup");
setupAutoComplete(textid);
setupAutoComplete1(textid1);
counter++;
});
$("#removeButton").click(function () {
if (counter == 1) {
alert("No more textbox to remove");
return false;
}
counter--;
$("#TextBoxDiv" + counter).remove();
});
});
var setupAutoComplete= function SearchText2(textid) {
$('.auto').autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Home.aspx/GetAutoCompleteData",
data: "{'code':'" + document.getElementById(textid).value + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
}
});
}
});
}
var setupAutoComplete1 = function SearchText3(textid1) {
$('.auto').autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Home.aspx/GetAutoCompleteData",
data: "{'code':'" + document.getElementById(textid1).value + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
}
});
}
});
}
</script>
now in this code I am generating maximun 10 textboxes two in each row and after that I write some code for json autocomplete for each dynamic generated textbox. Now problem is this when i click on my button after that its postback and all the textboxes and its values goes away. I am unable to maintain these textboxes. Can anybody tell me how can we maintain the dymanic generated textboxes after postback?
Thanks
I am trying to use following code:
var list_id = "Cust";
var page_id = "SubPageCust";
var show = "Company";
$.ajax({
url: "sap.php",
dataType: "json",
type: "POST",
success: function(data) {
var output = '';
$('#' + list_id).empty();
var value1 = "value." + show;
$.each(data, function(index, value){
output += '<li><a href="#' + value.show
+'" data-transition="slide">' + value.show + '</a></li>';
});
$('#' + list_id).append(output).listview('refresh');
The JSON title is Company:Company. Has anyone an idea how to use the value.title dynamically?
Regards
I have the following script which is able to access a jsonp feed and get data from it:
$(document).ready(function() {
get_jsonp_feed();
function get_jsonp_feed() {
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql?q=%20SELECT%20*%20FROM%20html%20WHERE%20url%3D%22http%3A%2F%2Fnews.bbc.co.uk%2Fweather%2Fforecast%2F4276%3Fsearch%3Dgerrards%2520cross%26itemsPerPage%3D10%26region%3Dworld%26area%3DGerrards%2520Cross%22%20and%20xpath%20%3D%20'%2F%2Ftable%2Ftbody%2Ftr'&format=json&diagnostics=true&callback=cbfunc",
type: 'GET',
dataType: 'jsonp',
jsonp: 'callback',
jsonpCallback: 'cbfunc',
error: function(xhr, status, error) {
alert(xhr.responseText);
},
success: function(data) {
var itemList = data.query;
alert(itemList.count);
/*
var buildHTML = [];
for (var i = 0; i < 5; i++) {
buildHTML.push('<div class="container">' + itemList[i].title + '<br /><span class="dateandtime">' + itemList[i].pubDate + '</span></div>');
}
$('.portlet-content').empty().append(buildHTML.join('<hr />'))
*/
}
});
}
});
That gives me 5 which is right. I now want to get data which is more embedded in the jsonp, but I have having difficulty. For example, I want to get:
data.query.results.tr.td.div.abbr.title
How would I go about getting that?
Here is a jsfiddle of it returning 5:
http://jsfiddle.net/B6hRG/1/
Here is some fixed code to get JSONP instead of XML:
$(document).ready(function() {
get_jsonp_feed();
function get_jsonp_feed() {
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%20%3D%20'http%3A%2F%2Fnews.bbc.co.uk%2Fweather%2Fforecast%2F4276%3F%26search%3Dgerrards%2520cross%26itemsPerPage%3D10%26region%3Dworld%26area%3DGerrards%2520Cross'%20and%20xpath%20%3D%20'%2F%2Ftbody%2Ftr'&format=json&callback=?",
type: 'GET',
dataType: 'jsonp',
error: function(xhr, status, error) {
alert(xhr.responseText);
},
success: function(data) {
var itemList = data.query;
alert(itemList.count);
/*
var buildHTML = [];
for (var i = 0; i < 5; i++) {
buildHTML.push('<div class="container">' + itemList[i].title + '<br /><span class="dateandtime">' + itemList[i].pubDate + '</span></div>');
}
$('.portlet-content').empty().append(buildHTML.join('<hr />'))
*/
}
});
}
});
To get data like data.query.results.tr.td.div.abbr.title you'd have to either use a for loop on the data.query.results.tr.td object, and any others with siblings, or use XML and get the raw html, put it into a document fragment and use jQuery on that.