I have user control which is included in most of my aspx page. This user control shows huge data from database. Now I have decided to fetch that by jquery. I am very much familiar with jquery and how to call server side method by jquery. My problem is that I can not specify ascx file in jquery ajax post method. Like
function loadMore() {
$.ajax({
type: "POST",
url: "Left.ascx/LoadData",
data: "{PageIndex:1}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
},
error: function (request, status, error) {
alert(request.responseText);
}
});
}
I can not call ascx code behind method by jquery because ASCX is not directly served via URL.
I cannot write even C# code for loading & populating ascx from aspx server side method dynamically because it has been used in many aspx. So now I am in problem. No easy & good idea is coming to my mind...so I am stuck. Please show me the way to achieve it. Thanks
You cannot call the ascx method directly. What you have to do is call an aspx page method and from that call the user control method. This sounded familiar so I checked. I have an answer to a similar question here:
Jquery .ajax async postback on C# UserControl
which shows the way this can be done.
It looks to me like you want to get HTML back from your response? Possibly so you can just set the contents of a div instead of having to build the html on the client. If that is the case, then make a new aspx page that contains your ascx and have the ascx databind in the page load of the aspx.
Related
I made a dashboard for my e-commerce website from where there is an option to selected page
after selecting a particular page if i press save button there i want to run these codes on selected page dynamically by which i can use scriptAnalytics.js file only for the pages i want.
var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src","scriptAnalytics.js")
document.getElementsByTagName("head")[0].appendChild(fileref)
You can use jQuery Ajax function to load and run your script:
$.ajax({
url: url,
dataType: "script",
success: successFunction()
});
or try to use shorthand method jQuery.getScript()
You can load js dynamically using jQuery.getScript() method on the page you want.
I use an Ajax Toolkit modal pop-up extender to pop-up a form for collecting information from the user. I intend to send the data collected from the user to the code behind for saving into the database on click of the submit button on that form. I found out, however, that the submit button is not posting back to the saver at all.
I do not want to use any client side coding or a web service.
Is it in any way possible to do post back on a modal pop?
There are two solutions of your problem:
Create form with asp:button in a div, initially set it's display none. At the time of popup just make it visible you can set it's position as your requirement. Then after click on submit button it will behave normally and redirect your page.
It is by using jQuery and Ajax. Create a html form and on submit call a JavaScript function
JavaScript function :-
function on_submit(){
var pageUrl = 'your_page_name.aspx'
$.ajax({
type: "POST",
url: pageUrl + "/your_web_method",
data: '{data1:value1, data2:value2}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
make your success code here
}
});
in C#
[WebMethod]
public static void your_web_method(data1, data2)
{
// your code to store value in database
}
I have issue in accesing drop down item from c# code behind
Scenario:
i am modifying drop down based on user selection using jquery/ajax call. while accesing the drop down item from code behind, still it retains old list.
Please help to access updated drop down list from c# code behind.
Sample code
Jquery code :
$.ajax({
type: 'POST',
url: "Search.aspx/LoadNewOptions",
contentType: 'application/json;charset=utf-8;',
dataType: "json",
data: "",
success: function (data) {
$("#dropdown").empty();
$($.parseJSON(data.d)).each(function () {
var Option = $('<option />');
xOption.attr('value', this.value).text(this.label);
$('#dropdown').append(Option);
}
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
C# Code behind code :
dropdown.SelectedItem.Value.Trim() // returns old value
Alternate Solution:
Created separate javascript function and store selected item values in hidden variable. No issues in accessing hidden variables from code behind.
The server has no knowledge of what ensued on the client unless you tell it.
It looks like you are dynamically appending elements to the dropdown. If you rebind the list when the page next executes, it doesn't know that you have modified it on the client.
hidden field is fine for simple situations
you can examine the POST and see if it contains a value which does not exist in the list, and if so, add it
The reason your old value didn't change because the server side has no knowledge of the new value. Unless you post it back to the server it will not be visible.
The title sort of explains what I'm trying to do.
The reason for this is that I am trying to implement infinite scrolling on my ASP.NET C# Website. I've previous accomplished the "effect" of lazy scrolling with the ListView Control but that was a dirty and 'slow' trick that used a DataPager and a couple of HiddenFields.
I would like to send a completely pre-formatted HTML element from a WebMethod to jQuery so that I can append it on the container <div>.
Actually what I need rendered in the WebMethod is a bunch of objects inside a container <div> that are similiar to the Facebook Wall. What I previous had was a ListView (B) nested in another ListView (A). A Single Each <ItemTemplate> from a single ListView had multiple ListViewItems of the other ListView. (A) Representing a wall post and (B) Comments bound to the Primary Key of (A).
Anyway, am I looking at this issue from the right corner or should I figure out some other way of doing this? Please share you thoughts.
Thank you.
You can just return a string from your webmethod with the html in it - and then pump it directly into an html element on your page on the 'success' function. NB I think this is the 'html()' element - or you can use .append(text);
Using JQuery
$(document).ready(function() {
// Add the page method call as an onclick handler for the div.
$("#Result").click(function() {
$.ajax({
type: "POST",
url: "Default.aspx/GetHTMLFormatted",
data: "{}",
success: function(msg) {
// Replace the div's content with the page method's return.
$("#Result").html(msg.d); // or .append(msg.d);
}
});
});
});
A better way to do it though is to return a JSON structure and use a template library to emit your html structure. See http://stephenwalther.com/blog/archive/2010/11/30/an-introduction-to-jquery-templates.aspx
Kindly help me to call a non-static method from code behind, using json object.
The following code is used in aspx page:
function columnDropdownScript() {
if (id == "ExpressionsLink") {
var dropdown = document.getElementById("<%=ddlTableNames.ClientID%>");
}
/
/ Configure AJAX call to server on itemChange of ddlTableNames
$.ajax({
type: "POST",
url: "Webtop.aspx/FillColumnDropdown",
data: requestTableParameters,
//contentType: "plain/text",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
if (id == "ExpressionsLink") {
$("#ddlColumnNames").empty();
}
}
// alert('Check Column DropDown' + msg.d.length);
},
error: DisplayError //Event that'll be fired on Error
});
}
The following code is written in aspx.cs page
[WebMethod]
public static List<string> FillColumnDropdown(string selTableName)
{
//Code to update Selected Columns in table
}
Since you want to call page's instance method I believe that you want to use other page's controls properties or features provided by an ASP.NET platform like ViewState or some other. But when you fire plain ajax request you can't use any of that possibilities.
So the only one option for you to use ASP.NET Ajax. In that case page comes through full life cycle including recreation all page's controls instances on the server, reading ViewState and so on.
Mostly for using ASP.NET you don't need any custom javascript calls because all required javascript provided out of the box.
What do you need it's just add ScriptManager and UpdatePanel controls onto the page, put your dropdown in UpdatePanel and set AutoPostback on it to true. That's all. After that you can use server-side SelectedIndexChanged event habdler of that dropdownlist and it will be fired asynchronously.
For more info about using an UpdatePanel follow this link: Introduction to the UpdatePanel Control
EDIT: by the way: if you need only the Session or Application state or Cache but no page's controls properties and no ViewState you still can use plain ajax calls and static server methods.
Actually the AJAX is quite tricky thing :)