$("##ViewBag.PageGroupID").append(data);
Now ViewBag.PageGroupID returns the id of the div at runtime.What if i want to append data in the div(the id which i will get runtime).How do i acheive this?
$('#btnPageElementClick').click(function () {
var flag = false;
var b;
$.ajax({ type: 'GET', url: '/ScriptedTestCase/pageElementPV/' + $('#PageElements').val(), data: null,
success: function (data)
{
$("##ViewBag.PageGroupID").append(data); //where divID is the id of the div you append the data.
}
});
return false;
});
Make sure that inside the controller action that rendered the view that contains the script you have shown, you have actually set this data:
ViewBag.PageGroupID = "someDivId";
Also note that in HTML ids cannot start with numbers.
Related
I've a view that recives parameters from the frontend via AJAX.
I've passing AJAX parameters in a maner, but this time my way didn't work.
I've asked a friend for help, and he send me another way of sending AJAX data. To my untrained eyes they both work equal. So I don't know why mine does not work:
Why?
My friend's AJAX:
<script>
$("#id_shipping_province").change(function () {
var val_d = $("#id_shipping_department").val()
var val_p = $("#id_shipping_province").val()
$.ajax({
url: "/district/?d_name=" + val_d + "&p_name=" + val_p
}).done(function (result) {
$("#id_shipping_district").html(result);
});
});
</script>
My AJAX:
<script>
$("#id_shipping_province").change(function () {
var val_d = $("#id_shipping_department").val()
var val_p = $("#id_shipping_province").val()
$.ajax({
url: "/district/",
d_name: val_d,
p_name: val_p
}).done(function (result) {
$("#id_shipping_district").html(result);
});
});
});
</script>
View
def get_district(request):
d_name = request.GET.get("d_name")
p_name = request.GET.get("p_name")
data = Peru.objects.filter(departamento=d_name, provincia=p_name).values_list("distrito", flat=True)
# data = Peru.objects.filter(provincia=p_name).values_list("provincia", flat=True)
return render(request, "accounts/district_dropdown.html", {
"districts": set(list(data))
})
You need to pass the the d_name and p_name properties in a separate object specified by data. Currently you're passing them as top level properties of the ajax settings object, which won't have any effect.
var val_d = $("#id_shipping_department").val()
var val_p = $("#id_shipping_province").val()
$.ajax({
url: "/district/",
data: { // Pass parameters in separate object
d_name: val_d,
p_name: val_p
},
}).done(function (result) {
$("#id_shipping_district").html(result);
});
The data object is converted into a query string and appended to the URL.
In your friend's case, they are building up the query string manually when they create the URL - hence their version works.
dI use a kendo tooltip on cells of a column of a kendo grid but the content of the tooltip is empty.
When I use the chrome debugger, values are correctly set but there is nothing in my tooltip.
$("#gri").kendoTooltip({
filter: "span.tooltip",
position: "right",
content: function (e) {
var tooltipHtml;
$.ajax({
url: ".." + appBaseUrl + "api/Infobulle?id=" + $(e.target[0]).attr("id"),
contentType: "application/json",
dataType: "json",
data: {},
type: "GET",
async: false
}).done(function (data) { // data.Result is a JSON object from the server with details for the row
if (!data.HasErrors) {
var result = data.Data;
tooltipHtml = "Identifiant : " + result.identifiant;
} else {
tooltipHtml = "Une erreur est survenue";
}
// set tooltip content here (done callback of the ajax req)
e.sender.content.html(tooltipHtml);
});
}
Any idea ? Why it is empty ?
After looking at the dev's answer on telerik forums, i found out that you need to do something like
content: function(){
var result = "";
$.ajax({url: "https://jsonplaceholder.typicode.com/todos/1", async:false , success: function(response){
result = response.title
}});
return result;
}
changing directly with e.sender.content.html() won't work, instead we have to return the value. And i tried several approach :
i tried mimick ajax call with setTimeOut, returning string inside it or using e.sender.content.html() wont work
i tried to use content.url ( the only minus i still don't know how to modify the response, i display the whole response)
the third one i tried to use the dev's answer from here
AND check my example in dojo for working example, hover over the third try
Using datatables and fnRowCallback.
I am trying to bind click to each row on the 2nd column.
The table is returning the correct anchor in the 2nd column with the correct variables, but when I click on the link, ajax is sending each one as the same userid.
I think i need to use .each().click but every thing I try doesn't work.
Anybody know what im doing wrong.....
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
$('td:eq(1)', nRow).html(''+ aData[3] +'').click(function() {
var url = $('.view_log').attr("id");
var timestamp = (new Date()).getTime();
$("#table_container").hide();
$(".themenu").hide();
$("#log").show();
$.ajax({
type: "GET",
url: ''+url+'&x='+timestamp,
dataType: "html",
success: function(data) {
$("#log").html(data);
}
});
});
}
$('.view_log').attr("id"); will get only the first occurrence.
In this SO page try this in the console:
$('.post-tag') //returns all the tags element
$('.post-tag').attr('href') //returns only the href value of the first occurrance
In the handler, specify the event parameter and then use $(e.target) instead.
So $(e.target).attr('id') should do the job.
... .click(function(e){
var url = $(e.target).attr('id');
});
Demo
I am using Mvc3 and my view engine is razor and also writing jquery in my view,
how can i assign a value to text box based on select a value from drop down list.
example:
if i am selected EmpId form drop down then the text box will be fill with Employee Name form same table.
$("#Emplist").change(function(){
$.ajax({
url:"#Url.Action("GetEmployeeName","Employee")",
data:{
id: $(this).val()
},
success: function(data){
$("#EmployeeName").val(data);
}
})
})
<select id="Emplist"><option value='1'>Mehmet</option></select>
public string GetEmployeeName(int id){
var emp = //Get Employee by Id
return emp.Name
}
You could bind your OnChange event, make an ajax call and then populate the textbox with the response. You can pass a json result as response, and handle all the parameters you want.
$('#dropDownId').change(function()
{
empId = $(this).attr('value');
$.ajax({
url: '#Url.Action("Action", "Controller")',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({ EmpId: empId }),
success: function (data) {
if (data.Result) {
$("#txtId").val(data.EmpName);
}
}
});
});
Here is a sample example, where dropDownBoxId is the id of the dropDownBox and txtBoxId is the id of Textbox.
$(function () {
$('#dropdownBoxId').change(function () {
// gets the value from the drop down box
var selected = $("#dropdownBoxId option:selected").text();
// puts the value into the textbox
var txtBox = document.getElementById('txtBoxId');
txtBox .value = selected
});
});
I'm trying to initiate an ajax request whenever a person changes the value of a drop down list. I want to send the selected item of the drop down as a query string parameter.
How do I get the selected item from the drop down list using MooTools?
var theUrl = 'http://someurl.com';
window.addEvent( 'domready', function() {
$('ddl').addEvent( 'change',
function(event) {
var parameter = $('ddl').SOMETHING(); // help!
new Request({
url: theUrl,
data: { 'someParameterId' : parameter },
method: 'get',
onComplete: function(data) { alert(data); },
}).send();
}
);
});
Found it!
var parameter = $('ddl').get('value');