SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    problem in getting data using document.getElementById

    Hi...

    I got an error: Object Required when I use this code:

    Code:
        var SubQty = document.getElementById("SubQty").value;
    
    <input class='txt' type='text' name='SubQty[]' id='$joinId' size='12' style= 'border:none;' value=''/>
    How can I get the value?

    Thank you

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    The bit in red here:

    Code:
    document.getElementById("SubQty")
    needs to be an id on the target element. E.g

    Code:
    <input id="SubQty" ... >

  3. #3
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    The bit in red here:

    Code:
    document.getElementById("SubQty")
    needs to be an id on the target element. E.g

    Code:
    <input id="SubQty" ... >

    BUt my id= '$joinId';

    because it counts using php:

    here is my whole code:

    PHP Code:
    <?php                                                                          
       error_reporting
    (0);
       
    date_default_timezone_set("Asia/Singapore"); //set the time zone  
    $con mysql_connect('localhost''root','');

    if (!
    $con) {
        echo 
    'failed';
        die();
    }

    mysql_select_db("mes"$con);

    ?>
    <html>
    <title>Stock Requisition</title>
    <head>
    <link rel="stylesheet" type="text/css" href="kanban.css">



    <script type="text/javascript">
    function save_sr(){

        var SubQty = document.getElementsById("joinId").value;
        

    }


    </script>

    <script type="text/javascript">

    function test_(cmpd) {
        var len_ = (document.frmMain.elements.length) - 1;
      
         for (i=0; i <= len_; i++ ) {

           var strPos_ = document.frmMain.elements[i].id.indexOf(cmpd)

                  if (strPos_ != -1) {
                  var strPos = document.frmMain.elements[i].id.indexOf("_");
                  
    var strId = document.frmMain.elements[i].id.slice(strPos + 1) + "_" + document.frmMain.elements[i].id.slice(0,strPos)               
       document.frmMain.elements[i].value = Math.round((document.getElementById(strId).value * document.getElementById('DemandedQty').value) * 100 ) / 100;  
         } 
        }  
    }
    </script>

    </head>
    <body>
    <form name="frmMain"  method="post">


       <div>
    <table>
    <thead>
    <th>Items</th>
    <th>Sub Items</th>
    <th>Item Code</th>
    <th>Demanded Qty</th>
    <th>UoM</th>
    <th>Class</th>
    <th>Description</th>
    <th>BIN Location</th>
    </thead>
    <?php

    $DemandedQty 
    $_POST['DemandedQty'];

    $sql "SELECT DISTINCT Items FROM bom_subitems ORDER BY Items";
    $res_bom mysql_query($sql$con);
    while(
    $row mysql_fetch_assoc($res_bom)){
        
        
    $Items $row['Items'];
        
    $Items_ substr($Items123);
        
    echo 
    "<tr>
            <td style='border: none;font-weight: bold;'>&nbsp;<input type='name' value='
    $Items_' name='Items_[]' id='Items_' readonly = 'readonly' style = 'border:none;width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td>
            <td style='border:none;'>&nbsp;</td>
            <td style='border:none;'>&nbsp;</td> 
            <td style='border: none;'><center><input type='text' style='text-align: right;' name='DemandedQty[]' id='DemandedQty' size='12' onkeyup='test_(\"
    $Items_\")'></center></td>     
            </tr>"

                 
    $sql "SELECT Items, SubItems, ItemCode, UoM, Class, Description, BINLocation, Quantity FROM bom_subitems WHERE Items = '$Items' ORDER BY Items"or die(mysql_error());

    $res_sub mysql_query($sql$con);  
     
    $counter 0;
     while(
    $row_sub mysql_fetch_assoc($res_sub)){
         
    $joinId $counter "_" .  $Items_;      
         
    $Items $row_sub['Items'];
         
    $Items1 substr($Items123);
         
    $SubItems $row_sub['SubItems'];
         
    $ItemCode $row_sub['ItemCode'];
         
    $UoM $row_sub['UoM'];
         
    $Class $row_sub['Class'];
         
    $Description $row_sub['Description'];
         
    $BINLocation $row_sub['BINLocation'];
         
    $Quantity $row_sub['Quantity']; 
         
    $joinId2 =  $Items_ "_" $counter;

        echo 
    "<tr>
            <td style='border: none;'>&nbsp;<input type='hidden' value='
    $Items1'  name='Items1[]' id='Items1'></td>
            <td style='border: none;'>&nbsp;<input type='text' name='SubItems[]' id='SubItems' value='
    $SubItems'  readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td>
            <td style='border: none;'>&nbsp;<input type='text' name='ItemCode[]' id='ItemCode' value='
    $ItemCode'  readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td>
            <td><input class='txt' type='text' name='SubQty[]' id='
    $joinId' size='12' style= 'border:none;'/><input type='hidden' id='$joinId2' value='$Quantity' /></td>
            <td style='border: none;' size='3'>&nbsp;<input type='text' name='UoM[]' id='UoM' value='
    $UoM' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;' size='3'></td>
            <td style='border: none;'>&nbsp;<input type='text' name='Class[]' value='
    $Class' name='Class' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td>
            <td style='border: none;'>&nbsp;<input type='text' name='Description[]' value='
    $Description' id='Description' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;' size= '30'></td>
            <td style='border: none;'>&nbsp;<input type='text' name='BINLocation[]' value='
    $BINLocation' id='BINLocation' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td>     
            </tr>"
    ;    
     
    $counter  $counter  1;
    }

                     
    ?>
    </table>
    </div>


    <div id="save_btn">
    <input type="button" name="button" value="save" onClick="save_sr()" style="width: 5em;">


    </div>
    </form>
    </body>
    </html>
    Thank you

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by newphpcoder View Post
    BUt my id= '$joinId'
    The important thing for JavaScript is what will be output as the id. What will the id be once the PHP has been parsed? If you don't know, then there may be a better way to select that element. You could target the class instead, or getElementByTagName etc.

  5. #5
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    The important thing for JavaScript is what will be output as the id. What will the id be once the PHP has been parsed?


    what do you mean for this: What will the id be once the PHP has been parsed?
    I need to cound the ID using php.

    Thank you

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    PHP never makes it to the browser, so JavaScript won't see id='$joinId'. It will look like something else in the HTML. You need to know what will be output in the browser to be able to tell JS what the id is. Otherwise, as I added above, perhaps target the input in a different way, via the class, or with getElementsByTagName('input').

  7. #7
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How can I target using class?

    Thank you

  8. #8
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    I don't know much JS, unfortunately, but here's two ways I managed to get the value of that element:

    Code:
    var el = document.getElementsByTagName('input');
    var SubQty = el[5].getAttribute("value");
    and

    Code:
    var el = document.getElementsByClassName('txt');
    var SubQty = el[0].getAttribute("value");
    However, using getElementsByClassName is dangerous, as it's new to JS and not supported in older browsers. In that case, you could use a workaround, such as here:

    http://robertnyman.com/2008/05/27/th...ame-anno-2008/

  9. #9
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you it solve my problem

  10. #10
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    I don't know much JS, unfortunately, but here's two ways I managed to get the value of that element:

    Code:
    var el = document.getElementsByTagName('input');
    var SubQty = el[5].getAttribute("value");
    and

    Code:
    var el = document.getElementsByClassName('txt');
    var SubQty = el[0].getAttribute("value");
    However, using getElementsByClassName is dangerous, as it's new to JS and not supported in older browsers. In that case, you could use a workaround, such as here:

    http://robertnyman.com/2008/05/27/th...ame-anno-2008/
    It's not new to JS. The only main browsers that don't support it is IE8 and down.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by RyanReese View Post
    It's not new to JS.
    All is relative. As I understand it, it's part of the HTML5 DOM, which I consider to be new.

  12. #12
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    All is relative. As I understand it, it's part of the HTML5 DOM, which I consider to be new.
    I consider "new" to be based off time relation.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


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
  •