2012-01-27 10 views
0

私はフォームを持っています(PHPはHTMLまたは他の方法で書かれています)。ユーザーがドロップダウンリストでオプションを選択すると、入力値が取得され、テキストボックスがいくつか作成されます。 onchange()を使用しなければならないようです。スクリプト内の入力を読み込み、ロジックを実行するにはどうすればよいですか?別の.phpスクリプトを開く代わりに?PHPでHTMLでユーザ入力を読み込んで印刷する

現在、これは私が持っているものです。

<?php 
$tables = $_POST["tables"]; 
?> 

<html> 
<body> 

<form method="post" action="<?php echo $PHP_SELF;?>"> 
Table Name: <div id="tables"> 
<select name="tables"> 
<option value="Applications">Application</option> 
<option value="Device">Device</option> 
</select> 
</div> 
</form> 

<? 
echo "".$tables.""; 
?> 
+0

'のonchange()'イベントには、JavaScript、PHPではないです。 @nickbが答えたところで、PHPはユーザーがフォームを送信するまで何も変わっていないことを知りません。また、 '$ PHP_SELF'をそのような形式で使うことは決して良い考えではありません。それは[XSS攻撃まであなたを開きます](http://phpsecurity.wordpress.com/2007/11/03/the-danger-of -php_self /)。私は常にページ名をハードコードしています(たとえば、このページの名前がtables.php: '

')なら、それを更新する必要がありますあなたがページの名前を変更するとき、それはそれほど大きな問題ではありません。 –

答えて

1

HTMLはどちらか

  1. は、AJAX(JavaScriptを)使用してページを更新、または
  2. せずにブラウザに送信されると、あなたはPHPと対話することはできません。

事前に<select>のオプションがわかっている場合は、必要な処理を行うためのJavaScriptを記述する必要があります。ここにはsimple exampleがjQueryを使っています。

$('#tables_select').change(
    function(eventObject){ 
     alert('You chose ' + $(this).val()); 
     switch($(this).val()) 
     { 
      case 'Applications': 
       $('#tables').append('<input type="text" name="application_name" value="Enter an application name" />"'); 
      break; 
      case 'Device': 
       $('#tables').append('<input type="text" name="device_name" value="Enter a device name" />"'); 
      break; 
     } 

    } 
); 

あなたは、ユーザーが自分の選択を変更し、ときにページが最初にロード正しい<input>要素を挿入するために、それは良い出発点である場合には、挿入要素を削除するロジックを追加する必要があります。

0

入力タイプを追加したい場合はここをクリックデモdemo with code
次の方法を使用します。

<form method="post" action="<?php echo $PHP_SELF;?>" onChange="return createTxtbox()"> 
Table Name: <div id="tables"> 
<select name="tables"> 
<option value="Applications">Application</option> 
<option value="Device">Device</option> 
</select> 
</div> 
<span id="fooBar">&nbsp;</span> 
</form> 

、その後の書き込みはJavaScript、

<SCRIPT language="javascript"> 
function createTxtbox() { 
var type="text"; 
    //Create an input type dynamically. 
    var element = document.createElement("input"); 

    //Assign different attributes to the element. 
    element.setAttribute("type", type); 
    element.setAttribute("value", type); 
    element.setAttribute("name", type); 

    var foo = document.getElementById("fooBar"); 

    //Append the element in page (in span). 
    foo.appendChild(element); 

} 
</SCRIPT> 
関連する問題