コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
ホームページ バックエンド開発 PHPチュートリアル ボタンをクリックしてデータを更新する方法を教えてください。

ボタンをクリックしてデータを更新する方法を教えてください。

ringa_lee
May 12, 2018 pm 03:25 PM

「updqte」ボタンをクリックすると、ボタンが「保存」に変わり、セルがテキストボックスになると思います。テキストボックスを編集した後、「保存」をクリックすると、結果がデータベースに送信されます。 。ボタンの変更は js で行われ、残りの部分に戻ることができません。助けていただけますか? 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" 
content="text/html; 
charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">         
function showtd(num) {                         
document.getElementById("bg"+num).style.display = "none";             
document.getElementById("show"+num).style.display = "block";         
}         
function hidetd(num) {             
document.getElementById("bg"+num).style.display = &#39;block&#39;;             
document.getElementById("show"+num).style.display = &#39;none&#39;;         
}         
function change()          
{              
var tds = document.getElementsByTagName("td");             
var t1 = document.getElementById("a").innerHTML;             
var txt = document.createElement("input");              
txt.type = "text";              
txt.value = t1;             
txt.id = "sort_t";              
tds[29].appendChild(txt);              
txt.select();          
}        
function mouseup(){             
if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")             
{                 
var obj = document.getElementById("sort_t").parentElement;             
var txtValue = document.getElementById("sort_t").value;             
obj.innerText = txtValue;             
}         
}      
</script></head><body><form><table border="1">
<?php
$db = mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;root&#39;);
mysql_select_db(&#39;ec&#39;,$db);
if (!$db)
  {  
  die(&#39;Could not connect: &#39; . mysql_error());  
  }
  $result = mysql_query("select * from goods");
  echo "<tr><th>GoodsID</th><th>BarCode</th>
  <th>GoodsName</th>
  <th>Category</th>
  <th>Specifications</th>
  <th>Manufacturers</th>
  <th>Numbers</th>
  <th>Instructions</th>
  <th>Pictures</th>
  <th>Update</th>
  <th>Delete</th></tr>";
  $n = 0;while($row = mysql_fetch_array($result))  
  {  
  echo "<tr>";  
  echo "<td>" . $row[&#39;id&#39;] . "</td>";  echo "<td>" . $row[&#39;barcode&#39;] . "</td>";  
  echo "<td>" . $row[&#39;goods_name&#39;] . "</td>";  
  echo "<td>" . $row[&#39;category&#39;] . "</td>";  
  echo "<td>" . $row[&#39;specifications&#39;] . "</td>";  
  echo "<td>" . $row[&#39;manufacturers&#39;] . "</td>";  
  echo "<td>" . $row[&#39;number&#39;] . "</td>";  
  echo "<td>" . $row[&#39;instruction&#39;] . "</td>";  
  echo "<td>" . "<img src = &#39;$row[picture_url]&#39; style=&#39;width:80px;height=60px&#39;/>" . "</td>";  
  echo "<td id=&#39;bg$n&#39;>".     
  "<input id=&#39;btnshow$n&#39; type=&#39;button&#39; value=&#39;Update&#39; onclick=&#39;showtd($n)&#39;/>".     
  "</td>".     
  "<td id=&#39;show$n&#39; style=&#39;display:none&#39;>".         
  "<input id=&#39;btnclose$n&#39; type=&#39;button&#39; value=&#39;Save&#39; onclick=&#39;hidetd($n)&#39;/>".     
  "</td>";  echo "<td>"."<a href=&#39;delete.php?id=$row[id]&#39;>"."Delete"."</a>"."</td>";   
  echo "</tr>";  
  ++$n;  
  }
  mysql_close($db);
  ?>
  </table></form>
  </body></html>
ログイン後にコピー

ディスカッションへの返信 (解決策)

1. 保存ボタンをクリックした後にトリガーする onclick メソッドを与えます
2. ajax を使用してパラメーターをバックグラウンドに送信し、php プログラムを呼び出します
3. 次に、受け取ったコンテンツをデータベース
4. 成功または失敗した場合はページに戻ります

ここでデータを送信するには、ajax を使用する必要があります

1. 保存ボタンをクリックしたときにトリガーされる onclick メソッドを指定します
2. ajax を使用してパラメーターをバックグラウンドに送信しますそして、php プログラムを呼び出します
3. 次に、コンテンツを受信して​​データベースに送信します
4. 成功または失敗した場合は、ページに戻ります 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" 
content="text/html; charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">         
function showtd(num) {                        
document.getElementById("bg"+num).style.display = "none";             
document.getElementById("show"+num).style.display = "block";         
}         
function hidetd(num) {             
document.getElementById("bg"+num).style.display = &#39;block&#39;;            
 document.getElementById("show"+num).style.display = &#39;none&#39;;         
 }         
 function change()          
 {              
 var tds = document.getElementsByTagName("td");            
  var t1 = document.getElementById("a").innerHTML;             
  var txt = document.createElement("input");              
  txt.type = "text";              
  txt.value = t1;             
  txt.id = "sort_t";              
  tds[30].appendChild(txt);              
  txt.select();          
  }        	
  function mouseup(){            
  if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")            
  {                
  var obj = document.getElementById("sort_t").parentElement;            
  var txtValue = document.getElementById("sort_t").value;            
  obj.innerText = txtValue;            
  }         
  }      
  </script></head><body>	
  <form>	
  <table border="1">	
  <?php	
  $db = mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;root&#39;);	
  mysql_select_db(&#39;ec&#39;,$db);	
  if (!$db)	 
  {	 
  die(&#39;Could not connect: &#39; . mysql_error());  
  }	
  $result = mysql_query("select * from goods");	
  echo "<tr>	
  <th>GoodsID</th>	
  <th>BarCode</th> 
  <th>GoodsName</th>	
  <th>Category</th>	
  <th>Specifications</th>	
  <th>Manufacturers</th>	
  <th>Numbers</th> 
  <th>Instructions</th>	
  <th>Pictures</th>	
  <th>Update</th>	
  <th>Delete</th>	
  </tr>";	
  $n = 0;	
  while($row = mysql_fetch_array($result))
  	 {	 
  	 echo "<tr>";	 
  	 echo "<td>" . $row[&#39;id&#39;] . "</td>";	 
  	 echo "<td id=&#39;a&#39;>" . $row[&#39;barcode&#39;] . "</td>";	 
  	 echo "<td>" . $row[&#39;goods_name&#39;] . "</td>";	 
  	 echo "<td>" . $row[&#39;category&#39;] . "</td>";	 
  	 echo "<td>" . $row[&#39;specifications&#39;] . "</td>";	 
  	 echo "<td>" . $row[&#39;manufacturers&#39;] . "</td>";	 echo "<td>" . $row[&#39;number&#39;] . "</td>";	 
  	 echo "<td>" . $row[&#39;instruction&#39;] . "</td>";	 
  	 echo "<td>" . "<img src = &#39;$row[picture_url]&#39; style=&#39;width:80px;height=60px&#39;/>" . "</td>";	 
  	 echo "<td id=&#39;bg$n&#39;>".     
  	 "<input id=&#39;btnshow$n&#39; type=&#39;button&#39; value=&#39;Update&#39; onclick=&#39;showtd($n);change()&#39; />".     
  	 "</td>".     
  	 "<td id=&#39;show$n&#39; style=&#39;display:none&#39;>".         
  	 "<input id=&#39;btnclose$n&#39; type=&#39;button&#39; value=&#39;Save&#39; onclick=&#39;hidetd($n);mouseup()&#39;/>".     
  	 "</td>";	 
  	 echo "<td>"."<a href=&#39;delete.php?id=$row[id]&#39;>"."Delete"."</a>"."</td>";	  
  	 echo "</tr>";	 	
  	 ++$n;	 
  	 }	
  	 mysql_close($db);
  	 ?>	
  	 </table></form>
  	 </body></html>
ログイン後にコピー

テーブルの赤い部分は、この配列を動的にしたいのです。そうしないと、すべてのボタンが 1 つのデータに対してのみ動作します。何か良い方法はありますか？

1. 保存ボタンをクリックしたときにトリガーする onclick メソッドを指定します
2. ajax を使用してパラメーターをバックグラウンドに送信し、php プログラムを呼び出します
3. 次に、受信したコンテンツをデータベースに送信します
4. 次の場合はページに戻ります成功または失敗
申し訳ありませんが、24 行目です。今は色が付いていませんでした。

これを実行すると、非表示に設定されます
.show() が 1 つ
.hide() が 1 つ
操作がクリックされると、関数がトリガーされて別のボタンに変換されます

lz を選択することをお勧めしますjq セレクターは非常に強力です
ajax と組み合わせると、大量の入力送信作業を完了するのに十分です

ここでデータを送信するには、ajax を使用する必要があります

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" 
content="text/html; charset=UTF-8"><title>Insert title here</title><script language="javascript" type="text/javascript">         
function showtd(num) {                         
document.getElementById("bg"+num).style.display = "none";             
document.getElementById("show"+num).style.display = "block";         
}         
function hidetd(num) {             
document.getElementById("bg"+num).style.display = &#39;block&#39;;             
document.getElementById("show"+num).style.display = &#39;none&#39;;         
}         
function change()          
{             
 var tds = document.getElementsByTagName("td");             
 var t1 = document.getElementById("a").innerHTML;             
 var txt = document.createElement("input");              
 txt.type = "text";              
 txt.value = t1;             
 txt.id = "sort_t";              
 tds[29].appendChild(txt);             
 txt.select();          
 }        
 function mouseup(){             
 if (document.getElementById("sort_t") && event.srcElement.id != "sort_t")             
 {                 
 var obj = document.getElementById("sort_t").parentElement;             
 var txtValue = document.getElementById("sort_t").value;             
 obj.innerText = txtValue;             
 }         
 }      
 </script></head><body><form><table border="1">
 <?php
 $db = mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;root&#39;);
 mysql_select_db(&#39;ec&#39;,$db);
 if (!$db)  
 {  
 die(&#39;Could not connect: &#39; . mysql_error());  
 }
 $result = mysql_query("select * from goods");
 echo "<tr><th>GoodsID</th>
 <th>BarCode</th><th>GoodsName</th><th>Category</th><th>Specifications</th><th>Manufacturers</th>
 <th>Numbers</th><th>Instructions</th><th>Pictures</th><th>Update</th><th>Delete</th></tr>";
 $n = 0;
 while($row = mysql_fetch_array($result))
   {  
   echo "<tr>";  
   echo "<td>" . $row[&#39;id&#39;] . "</td>";  
   echo "<td id=&#39;a&#39;>" . $row[&#39;barcode&#39;] . "</td>";  
   echo "<td>" . $row[&#39;goods_name&#39;] . "</td>"; 
    echo "<td>" . $row[&#39;category&#39;] . "</td>";  
    echo "<td>" . $row[&#39;specifications&#39;] . "</td>";  
    echo "<td>" . $row[&#39;manufacturers&#39;] . "</td>";  
    echo "<td>" . $row[&#39;number&#39;] . "</td>";  
    echo "<td>" . $row[&#39;instruction&#39;] . "</td>";  
    echo "<td>" . "<img src = &#39;$row[picture_url]&#39; style=&#39;width:80px;height=60px&#39;/>" . "</td>";  
    echo "<td id=&#39;bg$n&#39;>".     
    "<input id=&#39;btnshow$n&#39; type=&#39;button&#39; value=&#39;Update&#39; onclick=&#39;showtd($n);change()&#39; />".     
    "</td>".     
    "<td id=&#39;show$n&#39; style=&#39;display:none&#39;>".         
    "<input id=&#39;btnclose$n&#39; type=&#39;button&#39; value=&#39;Save&#39; onclick=&#39;hidetd($n);mouseup()&#39;/>".    
     "</td>"; 
      echo "<td>"."<a href=&#39;delete.php?id=$row[id]&#39;>"."Delete"."</a>"."</td>";   
      echo "</tr>"; 
       ++$n;  
       }
       mysql_close($db);
       ?>
       </table></form></body></html>
ログイン後にコピー

24 行目の配列を動的に変更できますか? それ以外の場合は、すべてのボタンは同じデータのみを操作します。どう変更すればよいでしょうか?

rreee

今の説明はあまり明確ではありません。「 src= "/jquery/jquery.js">

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

もっと見る

人気の記事

R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）
2週間前 By 尊渡假赌尊渡假赌尊渡假赌
レポ：チームメイトを復活させる方法
4週間前 By 尊渡假赌尊渡假赌尊渡假赌
ハローキティアイランドアドベンチャー：巨大な種を手に入れる方法
3週間前 By 尊渡假赌尊渡假赌尊渡假赌
スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか？
3週間前 By DDD
R.E.P.O.ファイルの保存場所：それはどこにあり、それを保護する方法は？
3週間前 By DDD
もっと見る

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？
7315
9
Java チュートリアル
1625
14
CakePHP チュートリアル
1348
46
Laravel チュートリアル
1260
25
PHP チュートリアル
1207
29
もっと見る
Related knowledge
11ベストPHP URLショートナースクリプト（無料およびプレミアム） 11ベストPHP URLショートナースクリプト（無料およびプレミアム） Mar 03, 2025 am 10:49 AM

11ベストPHP URLショートナースクリプト（無料およびプレミアム）

Instagram APIの紹介 Instagram APIの紹介 Mar 02, 2025 am 09:32 AM

Instagram APIの紹介

Laravelでフラッシュセッションデータを使用します Laravelでフラッシュセッションデータを使用します Mar 12, 2025 pm 05:08 PM

Laravelでフラッシュセッションデータを使用します

LaravelのバックエンドでReactアプリを構築する：パート2、React LaravelのバックエンドでReactアプリを構築する：パート2、React Mar 04, 2025 am 09:33 AM

LaravelのバックエンドでReactアプリを構築する：パート2、React

Laravelテストでの簡略化されたHTTP応答のモッキング Laravelテストでの簡略化されたHTTP応答のモッキング Mar 12, 2025 pm 05:09 PM

Laravelテストでの簡略化されたHTTP応答のモッキング

PHPのカール：REST APIでPHPカール拡張機能を使用する方法 PHPのカール：REST APIでPHPカール拡張機能を使用する方法 Mar 14, 2025 am 11:42 AM

PHPのカール：REST APIでPHPカール拡張機能を使用する方法

Codecanyonで12の最高のPHPチャットスクリプト Codecanyonで12の最高のPHPチャットスクリプト Mar 13, 2025 pm 12:08 PM

Codecanyonで12の最高のPHPチャットスクリプト

2025 PHP状況調査の発表 2025 PHP状況調査の発表 Mar 03, 2025 pm 04:20 PM

2025 PHP状況調査の発表

See all articles