-
FEATURED COMPONENTS
First time here? Check out the FAQ!
I am new to Zul framework and can you some help to write/execute the javascript to do validation. My code is there : In .zul file <textbox id="credit_card_number" name="credit_card_number" c:onchange="testFunction()"/>
<script> </script>Alert is working. but none of the other alert working. I need to read the text box value.. and make Ajax call and get the response. Once get the response, need to set the other field. Please help me. Thanks in advance..
Okay. I insist that you don't have to make an ajax call manually. If the web server or the web site that will serve the ajax call is on a different domain than the one where your page is running, you will have troubles due to security issues related to ajax's nature. Normally, cross-domain ajax requests are not allowed. You have to use a hack like CORS.
Also, ZK framework is one of the safest ajax frameworks due to its server-side nature. Doing manually these ajax calls you may become vulnerable.
If i were you, i would try to put this communication code on the server-side in my ViewModel using the java.net.URLConnection to open a connection with the verification server.
But anyway, we are here to help, so here is a sample demonstrating ajax call from a zul page:
<?page contentType="text/html;charset=UTF-8"?>
<zk>
<window title="How to make a native ajax call" border="normal" xmlns:w="client">
<vlayout>
<textbox id="txtCardNumber" w:onChange="verifyCardNumber(this)"
placeholder="credit card number" />
<button label="Verify" w:onClick="onClickVerifyCardNumber()" />
<textbox id="txtAjaxResponse" placeholder="ajax response" />
</vlayout>
<script type="text/javascript"><![CDATA[
function onClickVerifyCardNumber() {
verifyCardNumber( $('$txtCardNumber') );
}
function verifyCardNumber(textbox) {
var cardNumber = textbox.getValue();
$.ajax({
url: "http://server:port/bla/bla/" + cardNumber,
success: function(response) {
$('$txtAjaxResponse').val(response);
},
error: function() {
alert("Bad things happen...");
}
});
}
]]></script>
</window>
</zk>
Hope that helps
Costas
May i ask why do you need to make an Ajax call?
In ZK, you may use the data binding mechanism to pass the value automatically to the server, then make any required validation and finally update your data model.
Costas
Thanks for the quick replay..
My requirement is to integrate of credit card.so when ever customer enters the credit card number, then need to make AJAX call and get the token from server.
here in ZK frame work,
====code starts===
<vbox spacing="2px"> <hbox widths="7em, 8em"> <label value="Customer name :"/> <textbox id="credit_card_number" name="credit_card_number" c:onchange="testFunction()"/>
</hbox>
<hbox widths="7em, 8em">
<label value="Credit card number:"/>
<textbox id="customer_name" name="customer_name" value="" />
</hbox>
<hbox widths="7em, 8em">
<label value="box"/>
<textbox id="customer_name1" name="customer_name1" value=""/>
</hbox>
</vbox>...
=====code ends ===
On change or on tab out, need to write AJAx call and get the token from server. once token is generated, need to update card details as ** 1234 in credit card field...
Help is appreciated.. Thanks in advance..
Asked: 2014-12-16 01:56:49 +0800
Seen: 44 times
Last updated: Jan 21 '15
How to stop combining commands in an ajax call ?
zk developmet is esay [closed]
Need help with scrolling horizontal tabs in Right-to-Left (Arabic)
Create tab dynamically, multitab application
Radio button value change on database value
How to implement, each user has its own session timeout time