Solved

jQuery: validating integer in a target textbox

Posted on 2010-09-07
6
1,326 Views
Last Modified: 2013-11-11
Hello everybody!

I am using:
jquery 1.4.2
jquery-ui-1.8.4

and I have the following code:
<form id="formParametros">
<div id="divParametrosDemo">
	<table class="ui-widget" style="text-align:left; width:90%">
		<tr class="ui-widget-header" style="text-align:center">
			<th colspan="3">Parámetros</th>
		</tr>
		<tr style="text-align:center">
			<th style="width:33%">Días por defecto</th>
			<th style="width:34%">Cantidad de Licencias por Usuario</th>
			<th style="width:33%">Evaluación de Sub-Contratos</th>
		</tr>
		<tr class="ui-widget-content">
			<td>
				<div id="divDescripcionDiasDemo" style="width:80%">
					<p>
						Los usuarios demo se les otorgará la licencia por una cantidad determinada de días.
						Si el usuario que autoriza no desea definir los días, el sistema utilizará una cantidad
						predeterminada. Dicha cantidad se define aquí.
					</p>
				</div>
			</td>
			<td>
				<div id="divDescripcionLicenciasDemo" style="width:80%">
					<p>
						Los usuarios demo se les otorgará la licencia por una cantidad determinada de días.
						Si el usuario que autoriza no desea definir los días, el sistema utilizará una cantidad
						predeterminada. Dicha cantidad se define aquí.
					</p>
				</div>
			</td>
			<td>
				<div id="divDescripcionEvaDemo" style="width:80%">
					<p>
						Los usuarios demo se les otorgará la licencia por una cantidad determinada de días.
						Si el usuario que autoriza no desea definir los días, el sistema utilizará una cantidad
						predeterminada. Dicha cantidad se define aquí.
					</p>
				</div>
			</td>
		</tr>
		<tr class="ui-widget-content">
			<td>
				<table>
					<tr>
						<td>Días:</td>
					</tr>
					<tr>
						<td><input type="text" id="txtDiasDemo" maxlength="2" /></td>
					</tr>
				</table>
			 </td>
			<td>
				<table>
					<tr>
						<td>Licencias:</td>
					</tr>
					<tr>
						<td><input type="text" id="txtLicenciasDemo" maxlength="2" /></td>
					</tr>
				</table>
			</td>  
			<td>
				<table>
					<tr>
						<td>¿Permitir?</td>
						<td><input type="checkbox" id="chkEvaDemo" /></td>
					</tr>
					<tr>
						<td colspan="2">Días:</td>
					</tr>
					<tr>
						<td colspan="2"><input type="text" id="txtDiasEvaDemo" maxlength="2" /></td>
					</tr>
				</table>
			</td>   
		</tr>
		<tr>
			<td colspan="3" id="sumarioParametrosDemo" class="ui-state-highlight" style="visibility:hidden; text-align:center">
				&nbsp;
			</td>
		</tr>
		<tr>
			<td colspan="3" style="text-align:center" class="ui-widget-header">
				<button id="btnGuardarParametrosDemo" style="font-size:small">Guardar</button>
			</td>
		</tr>
	</table>
</div>
</form>

Open in new window


which makes the next form:
Form
So, let's go to the problem.

There are 3 text boxes in the form, I need to validate on the click event of the button that the value of those text boexes is an integer.
I know jQuery provides a validation method which should be easy to use. I've been searching in the jQuery api, with no luck (jQuery validate() API) How can I do it?
0
Comment
Question by:karelog
  • 3
  • 2
6 Comments
 
LVL 13

Expert Comment

by:ansudhindra
ID: 33617584
hi, I dont know much about JQuery UI, but you can do it in normal javascript, onKeyPress event on textbox like

<input type="text" name="" onkeypress="return allownumbers();">

function allownumbers(event){
  var thekey=event.keyCode;
  if(thekey > 46 && thekey < 58) return true
return false;
}

this will allow only integers into the tex box.
0
 

Author Comment

by:karelog
ID: 33617645
nice code ansudhindra!

I know I can use normal javascript, is just that I would like to learn how to use the validate() method in jQuery because it has a lot of potential!
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 33619272
<<because it has a lot of potential!>>
lolz...check these
http://docs.jquery.com/Plugins/Validation/Methods/number (see demo)

http://www.kunalbabre.com/jQueryLibrary/index.php (do view source)

0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:karelog
ID: 33619621
Ok, I already looked at those examples!

now I can't understand where message comes out!
I want to re-write the error message to another and I can't D:
0
 
LVL 40

Accepted Solution

by:
gurvinder372 earned 500 total points
ID: 33619672
0
 

Author Closing Comment

by:karelog
ID: 33621887
thanks ^^
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

778 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question