Unable to populate data from json to form in extjs 4 - javascript

I have created a form panel and would like to populate json data into form.
I am sending url from tastypie.
{"EmailAddress": "aaaaa#gmail.com", "FirstName": "bbbbb", "HomePhone": "23333","resource_uri": "/api/xxxx/1/"}
Name of my form panel is formPanel.
When I am trying to run below the data is not populating by showing error.
formPanel.getForm().load({
method : 'GET',
url : '/api/xxx/1/?format=json',
});
Can any one please help me to load form.

#sreekanth, it is possible to load JSON data directly into a form (if the situation really calls for it). Take a look at the docs for Ext.form.action.Load. I'm not familiar with the tastypie API, but I suspect that the JSON response may not be exactly what ExtJS expects. From the ExtJS documentation:
Response Packet Criteria
A response packet must contain:
success property : Boolean
data property : Object
The data property contains the values of Fields to load. The
individual value object for each Field is passed to the Field's
setValue method.
All that said, #sha's suggestion is a good one: Getting familiar with the Store and Model objects in ExtJS will save you time and trouble in the long run.

I think you need read about ExtJs concepts for Stores and Models. You don't just load JSON object into ExtJs form. You actually need to create a store, load records to this store and load particular record into form.

Related

How to submit test data and post requests between views in Angular?

I have a theory as to how to approach them, and was looking for some guidance on how to solve this problem and see if I am on the right path, because I am not sure.
I have a web app for a project I am building, and I have a database that I need to query for specific information. I have a search button that is attached to a function in my MainController, and I need to have my data passed on to my result.html file, which displays information from a ResultsController.
This is my theory for how to get this working using fake data, and an html request (which uses promises I imagine?)
for fake/test data, I stored an array with objects that represents JSON data in my services file that was basically the parent to ResultsController and MainController, and ResultsController would take in that information and display it on the screen.
For querying a database, my search function would search the database, and fill/replace the array in my services file with additional information. By virtue of changing that array of objects in my services, my results.html should pull down new data automatically when I click search, since the ResultsController has access to that same JSON data. (also, clicking search submits the query and then does $location.path("/results") after to get to the results page).
For querying a database and dynamically changing the information on a page, are these the right steps to submitting a request to a database in pulling information down upon each "search" request?
You are on the right track in using a service to share logic and data between the two controllers. This is generally seen as best practice - and it is better than the approach that is sometimes used of putting the logic and data in a parent controller, and using scope to access it in child controller.
The style guide linked to above is worth a read if you are looking for some guidance on best practice in setting up an angular app (https://github.com/johnpapa/angular-styleguide).

json object directly from my view HTML

i'm using phonegap in order to make an application, then i'm using CodeIgniter as an API.
To get the data, i'm using a simple $.post from jQuery to a REST URL in CodeIgniter.
$.post(DIR+trad+"/format/json", function(data){
traducciones = jQuery.parseJSON(data);
}, json);
Based upon this, i got 2 questions, because i don't know if i should do it in different post methods.
The first question is, how do i get the data in json format?
The second question is, is there any way to call the json object directly from my view (HTML) ? or i need to do it using jquery or javascript?
how do i get the data in json format?
Searching for codeigniter+json gives me Output Class which has this example:
$this->output
->set_content_type('application/json')
->set_output(json_encode(array('foo' => 'bar')));
is there any way to call the json object directly from my view (HTML)?
Generally speaking, if you are generating the JSON yourself and you want to use it in HTML, then you will just skip generating JSON and use the data directly.
Generating JSON from a view only really becomes useful if you want to make the raw data available over a network.
If you want to fetch the data over HTTP for your view, then that is a job for the Model. See How to send a GET request from PHP?. This is useful if you have two different applications. One providing a web service for the data and one providing the user facing application.
If you want to update the page with new data after it has loaded, then this is a good usecase for JSON, but you can only do that with JavaScript (or another client side programming language).
If you want to using JSON as response format, just do like
$.post(url, {
"dataType" : "json",
"success" : function(response) {
// process your response here, it will be treated as JSON object
}
});

Share data between HTML pages

I want to send some data from one HTML page to another. I am sending the data through the query parameters like http://localhost/project/index.html?status=exist. The problem with this method is that data remains in the URL. Is there any other method to send the data across HTML pages using JavaScript or jquery.
why don't you store your values in HTML5 storage objects such as sessionStorage or localStorage, visit HTML5 Storage Doc to get more details. Using this you can store intermediate values temporarily/permanently locally and then access your values later.
To store values for a session:
sessionStorage.setItem('label', 'value')
sessionStorage.getItem('label')
or more permanently:
localStorage.setItem('label', 'value')
localStorage.getItem('label')
So you can store (temporarily) form data between multiple pages using HTML5 storage objects which you can even retain after reload..
I know this is an old post, but figured I'd share my two cents. #Neji is correct in that you can use sessionStorage.getItem('label'), and sessionStorage.setItem('label', 'value') (although he had the setItem parameters backwards, not a big deal). I much more prefer the following, I think it's more succinct:
var val = sessionStorage.myValue
in place of getItem and
sessionStorage.myValue = 'value'
in place of setItem.
Also, it should be noted that in order to store JavaScript objects, they must be stringified to set them, and parsed to get them, like so:
sessionStorage.myObject = JSON.stringify(myObject); //will set object to the stringified myObject
var myObject = JSON.parse(sessionStorage.myObject); //will parse JSON string back to object
The reason is that sessionStorage stores everything as a string, so if you just say sessionStorage.object = myObject all you get is [object Object], which doesn't help you too much.
possibly if you want to just transfer data to be used by JavaScript then you can use Hash Tags
like this
http://localhost/project/index.html#exist
so once when you are done retriving the data show the message and change the
window.location.hash to a suitable value.. now whenever you ll refresh the page the hashtag wont be present
NOTE: when you will use this instead ot query strings the data being sent cannot be retrived/read by the server
Well, you can actually send data via JavaScript - but you should know that this is the #1 exploit source in web pages as it's XSS :)
I personally would suggest to use an HTML formular instead and modify the javascript data on the server side.
But if you want to share between two pages (I assume they are not both on localhost, because that won't make sense to share between two both-backend-driven pages) you will need to specify the CORS headers to allow the browser to send data to the whitelisted domains.
These two links might help you, it shows the example via Node backend, but you get the point how it works:
Link 1
And, of course, the CORS spec:
Link 2
~Cheers

Extract data from HTML form

I've got some Javascript which gets the HTML for a form from the server via an XMLHttpRequest, and displays the form on the page.
What I'd like to be able to do is extract the data which would be sent via POST if the form was submitted, then send it via another XHR. The tricky bit is that the form could contain different elements of different types.
Is there a way of doing this without having to inspect each element on the form, determine its type, manually extract the data based on the type, and build it all into a query string?
Is there a way of doing this without having to inspect each element on the form, determine its type, manually extract the data based on the type, and build it all into a query string?
No, there isn't, but there are prewritten libraries that have the code for that already written. e.g. jQuery serialize
Note that if you want to make a POST request, then the data should go in the request body, not the query string.

SpringMVC how to populate part of the model from a JS array on form submition?

Probably the following description of the issue I'm encountering will be a bit vague, but I'll try to explain as good as I can.
I have a form that is being submitted to a Spring mvc controller. Additionally to the information from that form I want to populate an array of the model exposed by the controller, from an array I created in JavaScript.
On the server side, I want take the data received from the form and that array and persist it in a DB.
How do I populate the array I have on the server side, from the array created in JS when I submit the form?
Here is how I would do that :
Add a javascript listener to the submit event of the form. Before submitting the form, add fields to it with the values of the javascript array.
On the server side, make sure that the model as a collection attribute corresponding to these added fieds.
You could also serialize the array (in JSON for example) and put it in one field, and deserialize it on the server side.

Categories