Forums de discussion
ajax request with alloy ui
veggalam laxminarayana, modifié il y a 9 années.
ajax request with alloy ui
New Member Publications: 10 Date d'inscription: 10/04/12 Publications récentes
Hi,
Can anyone please explain me how to make a ajax request with alloy ui.
Following is my code.Here I am written the ajax request in submitForm() function and i am calling this submitForm() on clicking the submit button.
<portlet:resourceURL id="insert" var="saverecord"></portlet:resourceURL>
<script>
function submitForm(){
var id = $("#id").val();
var uname = $("#username").val();
var fname = $("#firstname").val();
var lname = $("#lastname").val();
var pwd = $("#password").val();
var dataString ='id='+id+ '&username='+ uname + '&firstname=' + fname + '&lastname=' + lname + '&password=' + pwd;
YUI().use('aui-io-request','node',function(Y) {
Y.io.request('<%=saverecord %>',
{
type: "POST",
dataType: 'json',
data: dataString,
on: {
success: function() {
// gets the result of this asynchronous request
var data = this.get('responseData');
}
}
}
);
}
</script>
<form method="post" id="myform">
<input type="hidden" name="id" id="id">
UserName: <input type="text" name="userame" id="username"><br><br>
FirstName: <input type="text" name="firstame" id="firstname"><br><br>
LastName: <input type="text" name="lastame" id="lastname"><br><br>
Password: <input type="password" name="password" id="password"><br><br>
<input id="submit" type="submit" value="submit" onclick="submitForm()" >
<input class="reset" type="reset" value="reset">
</form>
The script is not compiling.In Console it is showing that JavaScript Minifier failed.....
Is it right..?
Can anyone please explain me how to make a ajax request with alloy ui.
Following is my code.Here I am written the ajax request in submitForm() function and i am calling this submitForm() on clicking the submit button.
<portlet:resourceURL id="insert" var="saverecord"></portlet:resourceURL>
<script>
function submitForm(){
var id = $("#id").val();
var uname = $("#username").val();
var fname = $("#firstname").val();
var lname = $("#lastname").val();
var pwd = $("#password").val();
var dataString ='id='+id+ '&username='+ uname + '&firstname=' + fname + '&lastname=' + lname + '&password=' + pwd;
YUI().use('aui-io-request','node',function(Y) {
Y.io.request('<%=saverecord %>',
{
type: "POST",
dataType: 'json',
data: dataString,
on: {
success: function() {
// gets the result of this asynchronous request
var data = this.get('responseData');
}
}
}
);
}
</script>
<form method="post" id="myform">
<input type="hidden" name="id" id="id">
UserName: <input type="text" name="userame" id="username"><br><br>
FirstName: <input type="text" name="firstame" id="firstname"><br><br>
LastName: <input type="text" name="lastame" id="lastname"><br><br>
Password: <input type="password" name="password" id="password"><br><br>
<input id="submit" type="submit" value="submit" onclick="submitForm()" >
<input class="reset" type="reset" value="reset">
</form>
The script is not compiling.In Console it is showing that JavaScript Minifier failed.....
Is it right..?
Iliyan Peychev, modifié il y a 9 années.
RE: ajax request with alloy ui
New Member Publications: 19 Date d'inscription: 17/11/10 Publications récentes
In Liferay it would be better to use Alloy, not YUI directly.
Also, AlloyUI/YUI can submit a form via Ajax, there is no need to do this by yourself (to do var dataString ='id='+id+ '&username='+ uname + '&firstname=' + fname + '&lastname=' + lname + '&password=' + pwd;). You have to:
1. Be sure you have "io-form" (and "io-upload-iframe" if you are uploading file).
2. Put this in IO config object:
form: {
id: //the id of your form,
useDisabled: true or false here,
upload: true // put this to true if you want to upload files
},
3. Subscribe to form submit event, then prevent the default action and then submit the form via IO
See here:
http://yuilibrary.com/yui/docs/io/#the-configuration-object
Again, this is direct usage of YUI. You may also use Alloy, it is the same, you will have to do A.io.request(....)
Hope that helps
Also, AlloyUI/YUI can submit a form via Ajax, there is no need to do this by yourself (to do var dataString ='id='+id+ '&username='+ uname + '&firstname=' + fname + '&lastname=' + lname + '&password=' + pwd;). You have to:
1. Be sure you have "io-form" (and "io-upload-iframe" if you are uploading file).
2. Put this in IO config object:
form: {
id: //the id of your form,
useDisabled: true or false here,
upload: true // put this to true if you want to upload files
},
3. Subscribe to form submit event, then prevent the default action and then submit the form via IO
See here:
http://yuilibrary.com/yui/docs/io/#the-configuration-object
Again, this is direct usage of YUI. You may also use Alloy, it is the same, you will have to do A.io.request(....)
Hope that helps
Bogdan Cerovac, modifié il y a 9 années.
ajax request with alloy ui - getting serialized values from form
New Member Publications: 6 Date d'inscription: 07/07/14 Publications récentes
Hi after reading the AlloyUI and YUI documentation, forums, Stackoverflow etc. I wasn't able to find a solution for getting serialized POST variables in JavaScript and this post seemed the best place to ask a question, so that it could also be available to other AlloyUI / YUI noobs like me
So, using:
Y.io.request('resp.html',{
method: 'POST',
cache: false,
form: { id: 'fm2', useDisabled: true },
how can I get serialized data that is then sent via AJAX to a JavaScript variable?
http://yuilibrary.com/yui/docs/io/#configuration is a great asset but missing exactly this info...
I looked in http://alloyui.com/api/files/alloy-ui_src_aui-io_js_aui-io-request.js.html and http://alloyui.com/api/files/yui3_src_io_js_io-form.js.html and wasn't able to figure out where can I retrieve serialized POST.
OK, I could re-loop the form and get it's values but I believe it's better to have consistent source and so avoid discrepancies...
Can somebody please help?
So, using:
Y.io.request('resp.html',{
method: 'POST',
cache: false,
form: { id: 'fm2', useDisabled: true },
how can I get serialized data that is then sent via AJAX to a JavaScript variable?
http://yuilibrary.com/yui/docs/io/#configuration is a great asset but missing exactly this info...
I looked in http://alloyui.com/api/files/alloy-ui_src_aui-io_js_aui-io-request.js.html and http://alloyui.com/api/files/yui3_src_io_js_io-form.js.html and wasn't able to figure out where can I retrieve serialized POST.
OK, I could re-loop the form and get it's values but I believe it's better to have consistent source and so avoid discrepancies...
Can somebody please help?
Bogdan Cerovac, modifié il y a 9 années.
RE: ajax request with alloy ui - getting serialized values from form
New Member Publications: 6 Date d'inscription: 07/07/14 Publications récentes
Ok, found a way, if there is some better, please give a hint
For reference:
Solution lies in JS function Y.IO.stringify's return - http://alloyui.com/api/files/yui3_src_io_js_io-form.js.html#23
So for my example I just used:
var data = Y.IO.stringify('fm2', {'useDisabled': true});
where fm2 is my form id attr. and useDisabled parameter used for serializing disabled elements too...
Probably there is a better way (variable directly from AJAX call???) but this is re-using same function and so avoiding any discrepancies manual loops could cause...
For reference:
Solution lies in JS function Y.IO.stringify's return - http://alloyui.com/api/files/yui3_src_io_js_io-form.js.html#23
So for my example I just used:
var data = Y.IO.stringify('fm2', {'useDisabled': true});
where fm2 is my form id attr. and useDisabled parameter used for serializing disabled elements too...
Probably there is a better way (variable directly from AJAX call???) but this is re-using same function and so avoiding any discrepancies manual loops could cause...
sushil patidar, modifié il y a 9 années.