I have an asp.net mvc 3 application with some Action Method that handles GET requests and returns a page. Code looks like this:
[HttpGet]
public ActionResult Print(IEnumerable<string> arrayOfIds)
{
.......................
return View(someModel);
}
Also there is JavaScript code, that calls this action:
window.open('#Url.Action("Print","Appointments")' + urlArray, "Print", "width=620,height=410,scrollbars=yes");
Where urlArray can be really big. How can I pass this data to the Action Method without using URL string (maybe using content of HTTP Request)? I need it because URL is so big that browsers can't work with it.
UPD: May be my explanation wasn't really clear... I solved my problem. This is JavaScript code:
$.ajax({
url: '#Url.Action("Print","Appointments")',
type: "POST",
data: { listOfIds : listOfIds },
dataType: "text",
traditional: true,
success: function (data) {
printWindow = window.open('', 'Print');
printWindow.document.write(data);
}
});
Also I changed attribute of Action Method from HttpGet to HttpPost.
I don't think your question has much to do with JavaScript. The URL limitation is a feature of HTTP GET. You need to use HTTP POST, which you can't do with window.open().
However, you can do something like this...
window.open('about:blank', 'Print', 'width=620,height=410,scrollbars=yes');
document.myForm.target='Print';
document.myForm.urlArray=urlArray;
document.myForm.submit();
This opens a new window and posts an existing HTML form (method="post") to the new window. The example above assumes a hidden field with the name "urlArray", but you just need to supply whatever your Action Method expects.
You can tidy this up quite a bit if you have an existing form on the page already that you're using to capture the urlArray, you'll just need to target the form at a new window that is created by your form's onsubmit event handler.
You'll be better off posting a form to the current page (and thus transfer everything to the server side through POST) and then use RedirectToAction and pass your data at the server side.
It's a better way to do it. You can post the form using Javascript. So rather than window.open you'll be using form.submit()
EDIT:
Add target="_blank" to your form tag to open the results in a new window.
Related
I making a .Net web app using a third party gridview(DevExpress web form ASPxGridView).
Lets say I have two grids(Grid1 and Grid2, both devexpress).
I am running into an issue where I need to update values in Grid2 based on which column is clicked on Grid1(during the onClick event).
I am able to capture the row and column in JavaScript but am not able to pass it back to my serverside code.
The grid has some settings tied to the edit mode, that if the page does a full postback, the grid loses its edits.
I have tried setting a HiddenField and calling a postback, but that erases edits in my grid. I have tried passing the variables to a static method , but I cannot access the controls on my page to update Grid2. I have looked into trying to do a callback instead of a postback, but it looks like callbacks are referencing Client-Side methods.
Does any one know of a way to pass a client-side variable to c# without a postback, or to call a non-static c# method from JavaScript? Any suggestions would be greatly appreciated.
The most basic approach to do this would involve two parts, part 1) add an ajax js function on your your existing grid page to handle the click event and make the data request. Part 2) Code up a separate C# web page to receive your client-side Grid1-variable, process it accordingly, and then respond with the data for Grid2. Here's some pseudocode of what the ajax call might look like, hope it helps.
//in your javascript section
$("#Grid1Cell").click(function(){
$.ajax({
type: "GET",
url: '#Url.Action("GetGrid2Data", "SomeController")"?yourVar=' + encodeURI(yourVal),
//alternatively url: "yourNonMVCpage.aspx?yourVar=" + encodeURI(yourVal),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
if (response.SomeValues == "blah") {
$("#Grid2Cell").text(response.SomeValues); //update Grid2
}
}});
});
If you need to "connect c#", it is necessary to perform a request to the server (using any of the available techniques - callback, postback, etc.).
If you need to refresh another control (Grid2) rendering during this request, the corresponding HTML content should be returned as a results of this request.
According to the provided description, you need to implement "cascaded grids" - i.e., update a dependent grid when changing a main grid. If so, use the approach illustrated in the https://github.com/DevExpress-Examples/how-to-show-detail-information-in-a-separate-aspxgridview-e70 example and force the dependent grid custom callback (and further refreshing) via the client-side PerformCallback method + handle the server-side CustomCallback event.
This question already has answers here:
How to use type: "POST" in jsonp ajax call
(6 answers)
Closed 9 years ago.
I have an application where I am required to perform multiple form submits to external sites. I want the form submits to open new tabs.
What I do is I create a form element using javascript, and then I just do a form.submit(). I am aware that only one will make it through.
I am looking for work arounds. One way is using jsonp:
I have something like this so far
$.ajax({
dataType: 'jsonp',
url: path,
type: "POST",
async: "false",
contentType: 'application/x-javascript',
data: $('this').serializeArray(),
success: function (html) {
if (data != "") {
var link = html;
window.open(link,'', ''); //open's link in newly opened tab!
}
},
failure: function (html) {
alert(html);
}
});
return false;
});
However even I do specified the type to be post, I see in the chrome developer tools that I have an actual get being sent. I am guessing that is because of window.open.
Can somebody suggest techniques to achieve this/
Thank you
I am required to perform multiple form submits to external sites. I want the form submits to open new tabs. What I do is I create a form element using javascript, and then I just do a form.submit().
If you set the target attribute of the form element to "_blank" in the HTML, and set the action property of the form element instance to each of the external URLs in a loop (e.g., set the URL, call submit; set the next URL, call submit), you should be able to submit the form multiple times. (You'll probably have to do this within the handling of a user-generated event, and even then I wouldn't be absolutely sure a browser wouldn't — and shouldn't — block multiple new tabs sprouting up.)
But I would strongly push back on the original requirement, unless it's absolutely clear to the end user what you're going to be doing when they click that button or whatever.
I am new to Dojo Framework.I created one button using dojo constructor and dojo.connect onclick event function i written url and load functions.This url navigating servlet and get the response back.
but i don't want response back i want to send request only.
how to do this..anyone help me.
thanks in advance.
are you looking to navigate to another page? if so, you can use window.location.href or other approaches to achieve that. See the foll url for other approaches:
JavaScript: Navigate to a new URL without replacing the current page in the history (not window.location)
if you do not want to navigate but just send some data to the server (and dont care about the response), you can just write an empty function for the callback
var deferred = dojo.xhrGet( {
url : "xxx",
load: function(data) {
//ignore
}
});
});
However, it is recommended to always check the response to ensure there were no errors on the server side.
You could also use dojo.xhrPost to submit your form
I have built a calendar in php. It currently can be controlled by GET values from the URL. Now I want the calendar to be managed and displayed using AJAX instead. So that the page not need to be reloaded.
How do I do this best with AJAX? More specifically, I wonder how I do with all GET values? There are quite a few. The only solution I find out is that each link in the calendar must have an onclick-statement to a great many attributes (the GET attributes)? Feels like the wrong way.
Please help me.
Edit: How should this code be changed to work out?
$('a.cal_update').bind("click", function ()
{
event.preventDefault();
update_url = $(this).attr("href");
$.ajax({
type : "GET"
, dataType : 'json'
, url : update_url
, async : false
, success : function(data)
{
$('#calendar').html(data.html);
}
});
return false;
});
Keep the existing links and forms, build on things that work
You have existing views of the data. Keep the same data but add additional views that provide it in a clean data format (such as JSON) instead of a document format (like HTML). Add a query string parameter or HTTP header that you use to decide which view to return.
Use a library (such as YUI 3, jQuery, etc) to bind event handlers to your existing links and forms to override the normal activation functionality and replace it with an Ajax call to the alternative view.
Use pushState to keep your URLs bookmarkable.
You can return a JSON string from the server and handle it with Ajax on the client side.
I am successfully using #Ajax.ActionLink to refresh data on a portion of my page, but I would like to do the same from Javascript. How can I simulate the effects of clicking that ActionLink in js?
Thanks!
#Ajax.ActionLink("ClickMe", "List", "Organizations", New AjaxOptions With {.UpdateTargetId = "dashboardDetails"})
You need to look at using the $.get() and .$post() jQuery functions. So basically, you can perform a call to a controller action, from Javascript, using either of these functions (depending on whether your getting or posting data).
An example can be found here.
Behind the scenes Unobtrusive,JQuery simply matches on the ajax links with a[data-ajax=true] and runs this code:
$(document).on("click", "a[data-ajax=true]", function (evt) {
evt.preventDefault();
asyncRequest(this, {
url: this.href,
type: "GET",
data: []
});
});
asyncRequest simply runs an $.ajax call with all the options assembled for it.
You can get the same effect by simply sending a click to your link. Assuming you give your link an id with the optional HtmlAttributes like this:
#Ajax.ActionLink("ClickMe", "List", "Organizations", New AjaxOptions With {.UpdateTargetId = "dashboardDetails"}, new { id = "myajaxLink" })
you can simply trigger it with:
$('#myajaxLink').click();
JQuery has extensive support for ajax calls.
http://api.jquery.com/jQuery.ajax/
also check this blog out
Using jQuery ajax to load a partial view in ASP.NET MVC 2 and then retrieve the input on the server again