2011-12-05 55 views
0

我不知道javascript是如何工作的,但我可以通過從不同的站點複製來編寫下面的代碼。javascript內部的PHP代碼

我的目標是擁有2個電臺(1 =印度,2 =除印度以外),如果選擇了除印度以外的其他國家,則會顯示一個顯示所有國家/地區名稱的下拉框。

從數據庫中選擇下拉菜單,它通過自定義php函數實現。

我可以根據我的無線電盒選擇使代碼顯示下拉菜單。

我不能做什麼如下:

  1. 我無法從下拉列表中選擇任何值。
  2. 我不能讓下拉隱藏如果我改變選擇的單選框

這裏是形式的代碼:

<form action="<?php $_SERVER['PHP_SELF']?>" method="post"> 
    <fieldset> 
     <br /> 

     <script type="text/javascript"> 
      function onclickradio(entry){ 
       if (entry === true) { 
        alert("YOU HAVE CHOSEN INDIA"); 
       } 
       else { 
        document.getElementById('OTHER THAN INDIA').innerHTML = '</br><?php dropdown('country');?>'; 
       } 
      } 
     </script> 

     Country: </br> 
     <input onclick="onclickradio(document.getElementById('INDIA').checked);" id="INDIA" name="country" type="radio" checked="checked"/> INDIA 
     <input onclick="onclickradio(document.getElementById('INDIA').checked);" id="OTHER THAN INDIA" name="country" type="radio"/> OTHER THAN INDIA 

     <br /><br /><br /> 

     State: <input type="text" name="State" maxlength="30"/><br /> 
     Line1: <input type="text" name="Line1" maxlength="50" /><br /> 
     Line2: <input type="text" name="Line2" maxlength="50" /><br /> 
     City: <input type="text" name="City" maxlength="40" /><br /> 
     PIN Code: <input type="text" name="PIN_Code" maxlength="8" /><br /> 
     <input type="submit" name="submit_address" value="Submit Address" /> 
    </fieldset> 
</form> 

下面是自定義代碼PHP下拉菜單功能:浮現在腦海

<?php 
    function dropdown($tablename) /*remember to add single quote around the input*/ 
    { 
     $sql="SELECT * FROM ".$tablename; 

     $result=mysqli_query($GLOBALS["connection"], $sql) 
     or die('Error in running SELECT query'); 

     $options=""; //initialising the variable, so that it can be concatenated later 

     while ($row=mysqli_fetch_array($result)) 
     { 
      $x=0; /*$x is the index of the field in a row (it has to start with $x=0; 
        because the first index is 0 in php*/ 

      $rowstr=" # "; /*initialising the variable, 
          so that it can be concatenated later*/ 

      while ($x+1<=mysqli_num_fields($result)) /*mysqli_num_fields gives the actual number of fields, and not the index. 
                 Since the index starts with 0, it is to be incremented by 1 
                 before comparison with the mysqli_num_fields*/ 
      { 
       $rowstr.= $row[$x]." # "; //concatenation operator 
       $x=$x+1; 
      } 
      $options.="<option value=".$rowstr.">".$rowstr."</option>"; //concatenation operator 
     } 

     Echo "<select>".$options."</select>"; 
    } 
?> 

回答

3

有幾件事情:

  • 請勿將空格放在id值中。我建議你也使用小寫字母,這樣你就可以擁有「印度」和「非印度」。
  • 使用Firefox/Firebug的或類似的,看看你是否有任何JavaScript錯誤當您運行此
  • 考慮使用jQuery或類似趕上變化的事件 - 它是易於使用,並且採用添加JS功能的「不顯眼」的方法到你的頁面。
0

元素的Id字段不能有空格。剛剛嘗試刪除空格"OTHER THAN INDIA"或更換,以貌似OTHER_THAN_INDIA

0

要清除的選擇,如果印度選擇

function onclickradio(entry) { 
    if(entry===true) { 
     alert("YOU HAVE CHOSEN INDIA"); 
     document.getElementById('OTHER THAN INDIA').innerHTML = ''; 
    } 
    else { 
     document.getElementById('OTHER THAN INDIA').innerHTML = '<br/><?php dropdown('country');?>'; 
    } 
} 
+0

你必須記住PHP的事情是一個服務器端的語言,而JavaScript是一種客戶端語言 – craig1231

+0

怎麼樣在id字段的空間?你能得到「其他不是印度」的元素嗎? –

+0

印度/ notindia會更好,雖然它是由一個字符串包裝我不認爲它很重要 – craig1231

0

試試這個:

$(document).ready(function() { 
    // hide address inputs 
    $('#address').hide(); 

    // show address inputs if the not india button is pressed 
    $('#not-india').click(function() { 
     $('#address').show(); 
    }); 

    // re-hide address inputs if india is selected 
    $('#india').click(function() { 
     $('#address').hide(); 
    }); 

}); 

您還必須包括jQuery的你頁。

小提琴:http://jsfiddle.net/EN4jB/6/

請注意,我用下面的標記 - 特別注意的是,由於這個div的ID。

<input id="india" name="country" type="radio" checked="checked"/> India 
<input id="not-india" name="country" type="radio" /> Not India 

<br /> 

<div id="address"> 
<p><select> 
    <option>USA</option> 
    <option>UK</option> 
    <option>Ireland</option> 
    <option>etc...</option> 
</select> 
</p> 

<p>State: <input type="text" name="State" maxlength="30"/></p> 
<p>Line1: <input type="text" name="Line1" maxlength="50" /></p> 
<p>Line2: <input type="text" name="Line2" maxlength="50" /></p> 
<p>City: <input type="text" name="City" maxlength="40" /></p> 
</div>