Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Jan 2012
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts

    onchange problem

    I need the code to run a few functions on change, the box is a "date picker" and I unsure how to add my onchange function without breaking the date picker, can anyone help ?

    Code:
    p>end date:</p>
    			<input id='secondDate' type="text" size="25"><a href="javascript:NewCal('secondDate','ddmmyyyy')"><img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date" onchange="dateDiff() ;calculate() ;deposit() ;milecharge() ;agecheck()"></a>

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    it's almost impossible (for me, anyway) to say, given the snippet provided... it looks OK - do you have a link to a page, or at least a sample of the relevant code?

    on a personal note, I think that using onchange for text boxes is generally a bad idea as it is quite unintuitive... onkeyup tends to work better for me in almost all circumstances, if for some reason you do not want to have a button the user can press that will call those functions.

  • #3
    New Coder
    Join Date
    Jan 2012
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    it's almost impossible (for me, anyway) to say, given the snippet provided... it looks OK - do you have a link to a page, or at least a sample of the relevant code?

    on a personal note, I think that using onchange for text boxes is generally a bad idea as it is quite unintuitive... onkeyup tends to work better for me in almost all circumstances, if for some reason you do not want to have a button the user can press that will call those functions.

    the site is http://www.pennycarhire.co.uk/price.html i want it to run all the function whenever anyone changes the date input box, but i cant seem to get it working

  • #4
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    With an input field you should use onkeyup if you want to test every keypress or onblur if you want to test when they leave the field.

    You should only use onchange with select lists.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #5
    New Coder
    Join Date
    Jan 2012
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by felgall View Post
    With an input field you should use onkeyup if you want to test every keypress or onblur if you want to test when they leave the field.

    You should only use onchange with select lists.

    I have tried every "on " function i can find, the problem is that they dont click on the textbox its self, they click on the little calendar box next to it but no matter where i put any function, it still dose not work, even using google chromes inspect thing, it says its running the function, which it dose, it will run it when the click on the text box, but they don click the textbox at all, thats the problem i got

    also onkeyup wont work as there is no need to use a keyboard on my script

  • #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    you should theoretically be able to put this:
    Code:
    winCal.onbeforeunload=function (){
    	if(pCtrl=='secondDate'){
    	dateDiff();
    	calculate();
    	deposit();
    	milecharge();
    	agecheck()
    		}
    	}
    at the end of your NewCal function to call those functions when the pop up window is closed. Works fine in FF and Chrome, no dice in IE or Opera. Dunno why - maybe somebody does.

  • #7
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts

    better...

    ... at the end of your GenCell function you can change your PCellStr line to:
    Code:
    PCellStr="<td "+vColor+" width="+CellWidth+" align='center'><font face='verdana' size='2'"+vHLstr1+"<a class='calLink' href=\"javascript:winMain.document.getElementById('"+Cal.Ctrl+"').value='"+Cal.FormatDate(PValue)+"';"+vTimeStr+"window.opener.checkDats('"+Cal.Ctrl+"');window.close();\">"+PValue+"</a>"+vHLstr2+"</font></td>";
    and then put this anywhere:
    Code:
    function checkDats(tb){
    	if(tb=='secondDate'){
    	dateDiff();
    	calculate();
    	deposit();
    	milecharge();
    	agecheck();
    		}
    }
    works in all the abovementioned browsers

  • Users who have thanked xelawho for this post:

    chrisboots (02-09-2012)

  • #8
    New Coder
    Join Date
    Jan 2012
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    ... at the end of your GenCell function you can change your PCellStr line to:
    Code:
    PCellStr="<td "+vColor+" width="+CellWidth+" align='center'><font face='verdana' size='2'"+vHLstr1+"<a class='calLink' href=\"javascript:winMain.document.getElementById('"+Cal.Ctrl+"').value='"+Cal.FormatDate(PValue)+"';"+vTimeStr+"window.opener.checkDats('"+Cal.Ctrl+"');window.close();\">"+PValue+"</a>"+vHLstr2+"</font></td>";
    and then put this anywhere:
    Code:
    function checkDats(tb){
    	if(tb=='secondDate'){
    	dateDiff();
    	calculate();
    	deposit();
    	milecharge();
    	agecheck();
    		}
    }
    works in all the abovementioned browsers
    I cant get this to work, im not sure which line to replace it with, but it seems which ever one i do, its stops the script as it wont let you select a date

    Code:
    function GenCell(pValue, pHighLight, pColor, pClickable)
    { //Generate table cell with value
    	var PValue,
    	PCellStr,
    	PClickable,
    	vTimeStr;
    
    	if (!pValue)
    	{
    		PValue = "";
    	}
    	else
    	{
    		PValue = pValue;
    	}
    
    	if (pColor === undefined)
    	    pColor = CalBgColor;
    	
    	if (pClickable !== undefined){
    		PClickable = pClickable;
    	}
    	else{
    		PClickable = true;
    	}
    
    	if (Cal.ShowTime)
    	{
    		vTimeStr = ' ' + Cal.Hours + ':' + Cal.Minutes;
    		if (Cal.ShowSeconds)
    		{
    			vTimeStr += ':' + Cal.Seconds;
    		}
    		if (TimeMode === 12)
    		{
    			vTimeStr += ' ' + Cal.AMorPM;
    		}
    	}
    
    	else
    	{
    		vTimeStr = "";
    	}
    
    	if (PValue !== "")
    	{
    		if (PClickable === true) {
    		    if (Cal.ShowTime === true)
    		    { PCellStr = "<td id='c" + PValue + "' class='calTD' style='text-align:center;cursor:pointer;background-color:"+pColor+"' onmousedown='selectDate(this," + PValue + ");'>" + PValue + "</td>"; }
    		    else { PCellStr = "<td class='calTD' style='text-align:center;cursor:pointer;background-color:" + pColor + "' onmouseover='changeBorder(this, 0);' onmouseout=\"changeBorder(this, 1, '" + pColor + "');\" onClick=\"javascript:callback('" + Cal.Ctrl + "','" + Cal.FormatDate(PValue) + "');\">" + PValue + "</td>"; }
    		}
    		else
    		{ PCellStr = "<td style='text-align:center;background-color:"+pColor+"' class='calTD'>"+PValue+"</td>"; }
    	}
    	else
    	{ PCellStr = "<td style='text-align:center;background-color:"+pColor+"' class='calTD'>&nbsp;</td>"; }
    
    	return PCellStr;
    }


  •  

    LinkBacks (?)

    1. 04-29-2014, 11:52 AM

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •