pass two parameters DDL in JavaScript / jQuery - javascript

This function works fine but passes only one parameter from one DropDownList to the controller. How to make the transfer of two parameters of an (two DDL)?
$(function () {
$('#DDL_1_ID').change(function () {
var URL = $('#FormID').data('someAction');
$.getJSON(URL + '/' + $('#DDL_1_ID').val(), function (data) {
$.each(data, function (i, format) { });
});
});
});

You could continue appending query string parameters as you've done with ddl_1_tc...
$.getJSON(URL + '/' + $('#DDL_1_ID').val() + '&myotherparam=' + yourotherinput
Your url appears to be malformed though. I believe you're missing the name of the first value...
$.getJSON(URL + '?nameforfirstparam=' + $('#DDL_1_ID').val() + '&nameforsecondparam=' + yoursecondinput

Related

Passing a string with quotes inside of it from API response as argument to a function in JS

I'm passing below data that i'm capturing from an API to the function addToList().
//...
onclick="addToList(\'' + value.id + '\',\'' + value.title + '\',\'' value.image_url + '\')"
//...
function addTolist (id, title, image_url)
{
var data = {};
data.id = id;
data.title = title;
data.image_url = image_url;
data.format = "json";
$.ajax({
//...
}
My problem is that certain titles do have quotes in it (e.g A Knight's Tale) and i'm getting a syntax error because of it.
Is there a way to change the value that I'm capturing from value.title in order for it to be accepted as argument to my addToList function?
Thanks

Can't send parameter containing "#" to dot net web service from ajax

Cant send parameter containing "#" to dot net web service from ajax.
var s = encodeURI(
"http://subdomain.mydomain.domain.asmx/getData?OUserId=" + UserId +
"&Token=" + Token +
"&OrgId=" + OrgId +
'&Message=' + Message +
'&Schoolid=' + SchoolId +
'&SessionId=" ' + SessionId +
'&UnicodeValue=' + UnicodeValue +
'&ClassID=' + ClassIdCommaSeparated.toString()
);
$.ajax({
url: s,
error: function(err) {
alert(err);
},
success: function(data) {....
}
});
Here classIdCommaSeparated is 1#1#1#1#1,1#1#1#1#1,1#1#1#1#1.
Use encodeURIComponent on the individual parts, rather than encodeURI on the whole:
var s = "http://subdomain.mydomain.domain.asmx/getData?OUserId=" + encodeURIComponent(UserId) +
"&Token=" + encodeURIComponent(Token) +
"&OrgId=" + encodeURIComponent(OrgId) +
'&Message=' + encodeURIComponent(Message) +
'&Schoolid=' + encodeURIComponent(SchoolId) +
'&SessionId=" ' + encodeURIComponent(SessionId) +
'&UnicodeValue=' + encodeURIComponent(UnicodeValue) +
'&ClassID=' + encodeURIComponent(ClassIdCommaSeparated.toString());
$.ajax({
url: s,
error: function(err) {
alert(err);
},
success: function(data) {....
}
});
Technically, both the name (before the =) and the value (after the =) need to be encoded, but when your names consist just of the letters A-Z (in upper or lower case) or digits, like yours do, encoding them doesn't change them at all. (If you didn't know what those names were, you'd definitely want to pass them through encodeURIComponent.)
several hours after i am not able to understand what is arising this problem.but i have worked around to have a temporary solution to the problem.i have used underscore in place of # and i got it working.thanks #T.J. Crowder for having a look upon.

jquery Return ajax response and user defined variable to function

I am having an issue passing in a defined variable to a function from an ajax call. What should happen is on click of an element, it should pass the text of the clicked element to the function, do an ajax call which has nothing to do with the defined variable, return the variable and the data from the call to another function that renders the elements. When I get to the function that renders the html content, the variable is now undefined.
My question is how can I send the ajax response data and a user defined variable that has no correlation to the ajax call to another function?
My JSON function:
function getJSONP(url, data) {
return $.ajax(url, {
dataType: 'json',
data: data
});
}
My click event:
$('.day').on('click', function() {
getTimes($(this).text());
});
My first function that does the ajax (this is where the selector returns a value):
function getTimes(selector) {
console.log(selector);
var eventDate = selector;
getJSONP(CAL_API_URL).then(function(data) {
data = _.valuesIn(data)[5][0];
return data;
}).then(appendTimes(eventDate));
}
My 2nd function that renders the HTML (here the selector is undefined):
function appendTimes(dates, selector) {
console.log(selector);
_.forEach(dates, function(k, v) {
// Returns each event
_.forEach(k, function(k2, v2) {
// Returns multiple objects for each event
var availableTimes = k2.startTime + " (" + k2.open + " spots left!)",
timeId = k2.id;
$('.timeslot select').append('<option data-id="' + timeId +'">' + availableTimes + '</option>');
});
});
}
In this case, if you switched appendTimes to only accept selector and have it return a function, the returned function will get called when data is available.
function appendTimes(selector) {
console.log(selector);
return function (datas) {
_.forEach(dates, function(k, v) {
// Returns each event
_.forEach(k, function(k2, v2) {
// Returns multiple objects for each event
var availableTimes = k2.startTime + " (" + k2.open + " spots left!)",
timeId = k2.id;
$('.timeslot select').append('<option data-id="' + timeId +'">' + availableTimes + '</option>');
});
});
}
}
You are calling the method, not assigning a reference to it
}).then(appendTimes(eventDate));
needs to use a closure or binding
}).then(function() { appendTimes(eventDate) });
also you can not return from a promise so the return data is useless.

Showing local storage values on HTML page

I have a survey that stores values to local storage. Trying to make a very simple 'admin' page that its sole purpose is to only display the local storage in an semi organized fashion via table etc. I'm not exactly sure how to go about it.
Here is what i have to store it.
$( document ).ready(function() {
$('#Save').click(function (e) {
if (confirm('Are you sure you want to submit? You will not be able to go back.')) {
var person = $("#FirstName").val() + "." + $('#LastName').val();
$('input, select, textarea').each(function () {
var value = $(this).val(),
name = $(this).attr('name');
localStorage[person + "." + name] = value;
window.location.href = "Confirmation.html";
console.log('stored key: ' + name + ' stored value: ' + value);
});
}
});
});
the key stored is firstname.lastname.element,value. if it could simply display basically like the console view ordered by key that would be great. Any point in a direction would be appreciated.
Unless you really can't manipulate your server side code, I highly recommend that you use $.ajax to post your form to the server and then serve back a response. I doubt that local storage was intended for form submission in quite this way. Otherwise, see below.
In order for you to show your localStorage items on the next page, you need to reference your localStorage items on the next page. After you change window.location.href, the previous page's context is no longer valid, thus name and value no longer exist. You should use something similar to this for both pages:
Submit.html
$(document).ready(function() {
$('#Save').click(function (e) {
if (confirm('Are you sure you want to submit? You will not be able to go back.')) {
var person = $("#FirstName").val() + "." + $('#LastName').val();
$('input, select, textarea').each(function () {
var value = $(this).val(),
name = $(this).attr('name');
localStorage["name"] = name;
localStorage["person"] = person;
localStorage[person + "." + name] = value;
window.location.href = "Confirmation.html";
console.log('stored key: ' + name + ' stored value: ' + value);
});
}
});
});
Confirmation.html
$(document).ready(function() {
var name = localStorage["name"];
var person = localStorage["person"];
var value = localStorage[person + "." + name];
console.log('stored key: ' + name + ' stored value: ' + value);
});

Trying to add variables to twitter json url

I'm trying to create a function which uses a combination of jquery, json and javascript to retrieve a twitter feed using the $.getJSON() method.
I have the function working with a static url like so:
$.getJSON("http://twitter.com/status/user_timeline/owzzz.json?count=1&callback=?", function(data) {
What I'm trying to do is replace where you see the username owzzz and count with values passed into the function.
the function looks something like this:
var twitterFeed = function(username, count){
$.getJSON("http://twitter.com/status/user_timeline/owzzz.json?count=1&callback=?", function(data) {
$.each(data, function(i) {
var timestamp = new Date(this.created_at);
var text = this.text;
$("#twitter").html(text +'<a href="http://twitter.com/' + username + '/" class="timestamp">' + username + ' <span>' + timestamp.toDateString() + '<\/span><\/div>' ).click(function(e) {
window.location = 'http://twitter.com/' + username;
e.preventDefault();
});
});
}); } twitterFeed('owzzz',1);
I can add the passed value username in the .html() but not inside the getJSON();
Any idea how I would go about this?
Do the same as you do in the html function: String concatenation.
$.getJSON("http://twitter.com/status/user_timeline/" + username + ".json?count=" + count + "&callback=?", ...)
string concatenation.
$.getJSON(
'http://twitter.com/status/user_timeline/' + username + '.json' +
'?count=' + count + '&callback=?'
);

Categories