Ajax load data to several places at once - ajax

I would like to load a page and then fill in some placeholders on it with data via Ajax request. I did that with jquery, but the problem is this: the file that I fetch with Ajax is time-consuming, and I was able to load data only to one placeholder at a time: $("#div1").load("info.php");.
I would like to send data for all placeholders in one response but can't get the idea how can I put it into all placeholders at once.
Please advice if this is possible.
I'd really like to load array of values via Ajax then put it into placeholders (divs) with some for in JS, but can't find a way to.

If you're trying to get the data from one request then try one ajax call and iterate like so...
array = {'id': {'pointer': 'div_id', 'content': 'the content'}}
//in a for loop -> item
$(item['pointer']).html(item['content'])

Related

Is it better to retrieve data through AJAX or returning it alongside view from Controller (Laravel)?

So the scenario is getting data we need from controller and using it in our view. But there are two options, you can have either this line in your "show" method:
UserController#show
return view('webpage');
And in the 'webpage' you can send an Ajax request to UserController#fetch and get that data. Or you can get the data from database in UserController#show and then send it alongside view like this:
UserController#show
return view('store', compact('store'));
But which is the more efficient and secure way of doing this?
It really depends on what you're doing, if the data you're requesting and the process you're running takes a lot of time or in a future it would, ajax is the way to go, but if process is short and the requested data from your model is small, then you can request it on the same method that returns your view and send the data to it.

Client side to server side calls

I want to change the list of available values in a dropdown depending on the value selected in another dropdown and depending on values of certain fields in the model. I want to use JQuery to do this. The only hard part is checking the values in the model. I have been informed that I can do this using Ajax. Does anyone have any idea how I will approach doing this?
AJAX is indeed the technology your looking for. It is used to sent an asynchronous request from the client browser to the server.
jQuery has an ajax function that you can use to start such a request. In your controller you can have a regular method tagged with the [HttpPostAttribute] to respond to your AJAX request.
Most of the time you will return a JSON result from your Controller to your view. Think of JSON as something similar to XML but easier to work with from a browser. The browser will receive the JSON and can then parse the results to do something like showing a message or replacing some HTML in the browser.
Here you can find a nice example of how to use it all together.

use ajax to fetch data from java hashtable in jsp page

I'm working on a project that the web page will fetch the data from java hashtable object in jsp page. I'm using a jsp for gerenated the web page based on HTML. The data is stored in the java hasbtable object on the server. I want to try to make an AJAX call to fetch the data from the server, then display it in the jsp page.
I just want to know if this is possible to do that by make an AJAX call to access the java hashtable object, then fetch the data back to the client side.
Thanks
Here is the test.jsp page which contain the hashtable obejcts:
Hashtable generalTable = (Hashtable) metaDataTable.get("General");
Hashtable adminTable = (Hashtable) metaDataTable.get("Administration");
My inital approach is to make an AJAX call to this test.jsp page. Then try to access those two GeneralTable and adminTable hashtable objects. In those two obejcts, it contains the values I would like to fetch.
Unfortunately, I don't have the code yet for my part because I don't know if this is possible or not.
Yes, it's possible, but you will need to have some server-side code to deal wit the request for the data you want, just like with any other AJAX functionality in any other system.
One way to do this would be to have a "special" jsp that gives you back the data you need without any of the typical HTML. Having the special jsp output it's data as a JSON object will make your life much easier in the client-side code.

Is it possible to send a form and a html request with same Event by Mootools?

$('submitbutton').addEvent( 'submit', function(e){
e.stop();
$('fuss').send();
req2.send();
});
trying to get this working but not sure if it is possible and had no success so far.
Mootools docs doesnt helped me either.
Will the multiple usage of .send() work?
Do i have to specify the data beeing send for the html request or does it take automatical the data beeing send by the form ?
It's in the documentation: http://mootools.net/docs/core/Request/Request#Element:send
This shorthand method will do a request using the post-processed data from all of the fields.
You can do as many requests in a specific event as you wish, as long as they're all asynchronous.
In your specific example it would seem you want to do two requests using two different methods, one with setting up a new Request class manually and the second doing it via the Element Method.
Based on your last comment, I wrote a little example in jsFiddle.
Basically I think you don't need two request for your goal. Just override onRequest method to update the html.

jquery ajax data string. How do i make an object or escape the string?

I have a button which calls jquery.ajax and submits POST data. I need to get user text from a textarea. So far, no problem. However now i need to set the post data. I have a string in the form as k=v&k2=v2 etc and then i have this user text. I obviously cant write + "&usertext=" + usertext since the text may have code and &kxxx=val which should be inside of the usertext value.
How do i set the ajax data?
http://api.jquery.com/serialize/
You can call the jQuery method serialize on a form to get a valid data structure to pass in to jQuery.ajax instead of building it from scratch:
$.ajax({
data: $('#myform').serialize()
});
For the values outside of your textarea you can then add them as hidden inputs in your form and they'll be pulled in to the resulting serialize data.
there are at least 2 options:
1. use http://jquery.malsup.com/form/ jQuery plugin, see 'ajaxSubmit' method
2. use 'serialize' method of jQuery (seee here for details)

Resources