SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help me.. Onclick event

    Please help me to make on event click like this



    <scripts>
    function checkData(noid){
    ................................
    }
    </scripts>




    <tr>
    <td>No ID<input size='4' name='noid' value=''><br />
    No ID<input size='4' name='status' value=''><br />


    <input class=button_content type=button name=submitButton$subid value=Submit onclick=\"checkData(noid.value)\"/>
    </td>
    </tr>

    This scripts successfull working
    but today I want to add to Onclick event with 2 variable. in the above scripts only use :noid
    I want use noid and status

    how to change the script onclick=\"checkData(noid.value)\" and function checkData(noid)



    thank very much

    DON

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Code php:
    <input ... onclick=\"checkData(noid.value, status.value)\"/>

    Code javascript:
    function checkData(noid, status){
        ...
    }

    There are several ways to do the above in a better way.
    The checkData function shouldn't be an onclick event on an input element. Instead, the form element has an onsubmit event itself which is purposely for checking the form before it's submitted. That just means changing the type of input from a button to a submit type instead.

    The trouble that you're facing with needing additional information from the form, can be easily avoided by getting a reference to the form itself from the script, and from the script you access the form elements that you need.

    Code html4strict:
    <form onsubmit="return checkData(this)">
        ...
        <input type="submit" value="submit" ...>
    </form>

    The this keyword points to the input element, so the function has to use el.form.elements to access the form elements.

    Code javascript:
    function checkData(el) {
        var validates = true;
        var noid = el.form.elements.noid.value;
        var status = el.form.elements.status.value;
        ...
        return validates;
    }

    You can even take this further into the realms of unobtrusive javascript, where the scripting is kept separate from the html.

    Code html4strict:
    <form id="myForm">
        ...
        <input type="submit" value="submit" ...>
    </form>

    The script just needs to be run after the form element is available. The best way to do this is to place the script at the bottom of the body, just before the </body> tag. If you can't do that and must run the script from the head, you can place the script in the head inside a window.onload function.

    Note that the this keyword now refers to the form itself, so this.elements is all that's required to acecss the form elements.

    Code javascript:
    document.getElementById('myForm').onsubmit = function () {
        var validates = true;
        var noid = this.elements.noid.value;
        var status = this.elements.status.value;
        ...
        return validates;
    };
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank You very Much
    I have been try this code and working..!

    I am modify this by using 3 value

    onclick=\"checkData$subid(noid$subid.value,cat$subid.value,cap$subid.value)\"/>


    <scripts>
    function checkData<?=$subid?>(noid<?=$subid?>,cat<?=$subid?>,cap<?=$subid?>){
    ................................
    }
    </scripts>

    thank once again

    DON


Bookmarks

Posting Permissions

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