How to dynamically change the URL in Select2 using AJAX? - ajax

I am using ui-select2 in angularjs for remote data access.
I am having a drop down, based on the value chosen in dropdown the URL present in the ajax call should change dynamically , so that I can get the data from that particular URL.
Is it possible to change the URL dynamically based on the value present in the dropdown?

I've resolved this problem using function in ajax property:
ajax: {
url: function () { return '/product/' +$scope.campaign.advertiser + '/tags/'; },
...
}

Related

How to insert data using ajax with id and without using forms in laravel

I try to insert data using id in my url like this.
absent
present
My route is:
Route::get('/present/{id}', 'UserController#present')->name('present');
Route::get('/absent/{id}', 'UserController#absent')->name('absent');
Route is working. but the page is loading, I try to insert data without loading. I know how to insert data using ajax HTML form way. but how to insert using id use ajax?
If you want to insert data without reloading you have to bind JavaScript functions to the HTML links you specified. This example is different but you can use the same approach to achieve your need.
I propose, that you change your anchor tags to buttons and add a class to them and save their routing endpoints in data attributes:
<button class="action_buttons" data-route="{{route('absent', $User->id)}}">absent</button>
<button class="action_buttons" data-route="{{route('present', $User->id)}}">present</a>
And, then use JQuery event handling to detect when they are clicked and then simply use Ajax to get the related route from the button's data attribute and send a GET request to that route:
$('.action_buttons').on('click', function(){
// Get the route data from the tag.
let route = $(this).data('route');
$.ajax({
url: route,
type: 'GET',
success: function(resp) {
console.log(resp);
}
});
});

Ajax query string param are being added to standard get request

I have an ajax code with parameter like this
var data = {
attr1: 'attr1',
attr2: 'attr2',
}
jQuery.ajax({
type: 'GET',
url: '/report/preview.html',
data: data,
dataType: 'html',
success: function(result){
jQuery('#report-body').html(result);
},
error: function(xhr,a, b){
console.error(xhr.responseText);
}
});
The function generates url - /report/preview.html?attr1=attr1&attr2=attr2.
I have a display table in jsp which does a full reload every page navigation. My problem is that it also append the parameter i set in ajax call to the url in browser.
The url of display table action is /report/reportHome.html. after the ajax call, when i navigate to another table page, the url becomes /report/reportHome.html?attr1=attr1&attr2=attr2. It appended the ajax param to its parameter. How can i remove these parameters? thanks.
Use a form and POST the information.
Use Path variable Ex: /report/attr1/attr2/preview.html
Use Session
Use some encode/decode
I have resolved my problem! The problem happens because the 'requestURI' attribute of the generated display table of the ajax call adds any tag generated parameters to its value. That is why the request param in the ajax call are being appended automatically as query string in the 'requestURI' attribute of the generated table.
I have resolved this by adding the ajax parameters in the 'excludedParams' attribute of the generated table so they won't be added as query string
So it does not matter what type of request the ajax uses(get or post).

Ajax & Grails - how to use the params from the model in the success of the Ajax?

I have an Ajax which call to an action in a controler.
The controller render:
render template:"changePassword", model:[user: user, passwordError: passwordError]
The passwordError is boolean.
In case the passwordError is true I have to perform function in the js.file.
How can I check in the success's Ajax the value of the passwordError?
The code of the Ajax:
$.ajax({
url: changePassword,
type: "post",
data: {
password: $('#password').val(), npassword: $('#npassword').val()
},
success: function(data,textStatus){
$('#changePassSuceess').modal()
}
});
If you dont need to render a template, you can return a json as #Eylen mentioned and then access the flag from json. If you must render a template then you can have a hidden field in your template with value set to the flag passwordError and then you can get the value of flag from this hidden field in your javascript code
See this question for how to find hidden element in jquery ajax response html
If you don't need to show the template that you are returning, then you can change your return from the controller to something like the following
return [passwordChanged:true] as JSON
Ans then in your ajax call you will have access to the JSON object in the data attribute.
console.log(data.passwordChanged);
Maybe you have to tell also in the ajax call that the return type is json.

Set Session value from JavaScript and Get Session value in C#

Is it available to set the value from javascript(Session / ViewState) and get the value in C# without using hidden field??
Its work to store the value from javascript , and available to get the value in C# (page.request["Token"]) , but its not working for me because there have a postback action " form.submit();"
function setToken(Token) {
try {
var form = document.createElement("form");
var field = document.createElement("input");
field.setAttribute("type", "hidden");
field.setAttribute("name", 'Token');
field.setAttribute("value", accessToken);
form.appendChild(field);
document.body.appendChild(form);
form.submit();
} catch (err) {
}
}
If you want to submit a value from your clientside code to your serverside code, you'll need to submit it in some kind of request. A form post would be one way, but if you don't want the page to reload it could equally well be an AJAX request:
function setToken(accessToken) {
$.post('/SetToken', { Token: accessToken });
}
Using jQuery there as it'll save you a lot of the trouble involved in getting AJAX to work the same way across browsers.
In the example I'm posting a request to a page called /SetToken, which could be any url in your website where you have code that can update the token. Your own example submits a form without an action, which means it'll submit to the current page. You could easily do that as well
$.post(location.href, { Token: accessToken });

How to Call an Action from a View and return its result?

I have defined an action on my controller which accepts an integer and returns a string value:
public string SqlQuery(int listItemId)
{
return _sqlListSharePointList.GetSqlQueryFromCache(listItemId);
}
How could I call this action from my view? also what other options do I have apart from AJAX?
I tried the below but didn't work:
$.get('/SqlReportList/SqlQuery', 1, function (data) {
alert(data);
});
the "SqlReportList" is the name of my controller.
I also tried the below code:
$.get('/SqlReportList/SqlQuery/1', function (data) {
alert(data);
});
But it threw an exception on production that the listItemId is null.
Should I decorate my Action differently?
I also tried accessing it via fully qualified name but same error:
http://localhost:4574/SqlReportList/SqlQuery/1
Thanks,
If you do not want to use ajax (which is recommended) then only way to call the method is thru page refresh, only that way you are hitting your server side (controller) again from the view.
$.get('/SqlReportList/SqlQuery', { "listItemId": listItemId }, function (data) {
$('#tbSqlQuery').text(data); }
);
Is the parameter known at the time of rendering the surrounding page?
If so (and I've understood your question correctly) then you can use Html.RenderAction. See http://haacked.com/archive/2009/11/17/aspnetmvc2-render-action.aspx
If not, then you can only really use AJAX or a full page reload. For getting the URL right for AJAX, you should be able to use Url.Action with some placeholder value.
The T4MVC project offers strongly-typed support for various things including action URLs, even supporting explicit placeholders for Javascript code. See section 2.2.2 of http://t4mvc.codeplex.com/documentation

Resources