リロードせずにtextareaコンテンツでMySQLを更新する

Question

私たちのMySQLデータベースの内容を編集用に読み込むページを作成しています。表の各行は、ページ上に別々の編集可能なテキストエリアにあります。私は、特定のテキストエリアを担当するボタンをクリックするだけで、ページ全体をリロードすることなく、各行を更新できるようにする必要があります（つまり、その内容をdbに送信する必要があります）。

私は、このような手順にはJavaScriptがいくつか含まれていることを理解していますが、悲しいことに私は誰も知りません - 私はPHPでできることはすべて行ったので、基本的に私の質問は、編集したテキストエリアからテキストを取得し、ページをリロードすることなくMySQLに送信する方法です。私が間違った方向に向かうなら、私は他の提案を聞いて喜んでいるだろう。

Answer 1

はいこれにはjavascriptが必要です。つまり、あなたが持っているPHPページへの非同期呼び出しです。これはしばしばAJAXと呼ばれます。

ここでは "jqueryを使用する"答えが嫌いですが、jQueryのAJAXベースの呼び出しを使用するには、このような呼び出しから得られる値には非常に低いです。

ドキュメントにはgreat examplesがあり、そのほとんどは非常に簡単です。

Answer 2

Ajaxについてもっと詳しくお試しください。それのためのライブラリがたくさんあります。

Answer 3

あなたが探しているものはAJAXです。 jQueryはそれをもっと簡単にします。 try starting here.

Answer 4

これは、AJAXが行うことです。非同期JavaScriptとXMLです。ページをリロードすることなく、サーバーに要求を送信できます。

私は、StackOverflowコミュニティなどで多くのサポートがあり、クロスブラウザのAJAXリクエストを非常に簡単にするjQueryから始めることをお勧めします。ページ上のjQueryスクリプトで

は、あなたがこのような何かを行うことができます。

$("#id-of-the-button-the-user-will-click").click(function() { 
    $.post('/path/to/your/script.php', { field1: value1, field2: value2 }, function(data) { 
     // This function is called when the request is completed, so it's a good place 
     // to update your page accordingly. 
    }); 
}); 

をまだJavaScriptを完全に理解する必要があります詳細を理解するので、実際に行うための最善のことはでダイビングしてスタートですJavaScriptをたくさん書いています。 AJAXは始めるには最適な場所です。

Answer 5

introduction to JavaScript at Operaがあります。ジブリングは、ページを離れることなくサーバーにデータを送信する通常の方法であるthe XHR objectの使用を対象としています。 YUIやjQueryなどのライブラリは、あなたにとって重労働のいくつかを行うことができます。

Answer 6

あなたは、テキストエリアにJavaScriptイベントを追加することができます。

onblur="sendUpdate(this.value)" 

ユーザーがテキストの編集を終了し、入力を離れたときに、このイベントが発生します。

たとえば、「this」は現在のテキストエリアコンポーネントを参照します。

そして、前述のようにAjaxを使用してください。例：

function sendUpdate (text) { 
    $.post('script.php', {textarea_value:text},function(){}); 
} 

Answer 7

スクリプト（JavaScript）からサーバーへの非同期呼び出しを行う必要があります。これを達成するには、ajaxを使用します。XMLhttpオブジェクトを使用して、クライアントサイドスクリプト（javascript）からサーバー/データベースと通信する必要があります。ボタンクリックを使用してページ全体を送信する必要はなく、代わりにボタンクリックイベントまたはonBlurイベントまたはonTextChangeイベントなどでjavscriptコードを呼び出すことができます。

jQueryは、これを実装するコード行数を減らしてください。しかし、あなたはjqueryを使用する必要はありません.jQueryを使用せずにajax呼び出しを行うことができます.jQueryの使用は行数を減らします。

チェックこの

http://docs.jquery.com/Ajax/jQuery.ajax

Answer 8

あなたは間違いなくJavaScriptを必要とし、ページをリロードせずにPHPサーバにHTTPリクエストを送信するいくつかの方法でしょう。一般に、これはAJAXと呼ばれます。

JavaScriptの初心者にとってAJAXは少し複雑なので、おそらくJavaScriptライブラリを使用することをお勧めします。良い選択は、通常のHTTPリクエストを実装するためにXMLHttpRequestまたはJSONPを使用JQuery、またはMooTools

AJAXライブラリです。それらを理解することはそれを少し楽にするはずです。

• jQueryのAJAX：http://docs.jquery.com/Ajax
• MooToolsのAJAX：それを更新し、textarea要素を選択http://mootools.net/docs/core/Request/Request

、DOM（http://www.w3.org/DOM/）の使用を必要とします。ほとんどのJavaScriptフレームワークでは、CSSまたはXSLTセレクタの実装を使用してDOMをクエリします。 jQueryのセレクタ

• ：http://docs.jquery.com/Selectors
• MooToolsのセレクタ：http://mootools.net/docs/core/Utilities/Selectors

Answer 9

あなたはJavaScriptをせずに、この罰金を行うことができます。

204 No Content 

状態の代わりに、[OK]を200と新しいページ：ちょうどそのテキストエリアの値からデータベースを更新し、返すスクリプトにフォームを送信し、>独自の<形で各テキストエリア+ボタンを持っています。古いページが置かれたままになります。

Answer 10

あなたはすなわち加えられた変更をピックアップするjqueryの機能を追加することで起動することができます。

$('#inputelement').on('input propertychange', function(){ 
      alert("Alert to test jquery working"); 
     }); 

PHPはサーバーにアップデートする方法であるとして、あなたはその後、（データをPHPスクリプトを作成するために、AJAXを使用する必要があります）、GET変数またはPOST変数を使用して送信します。その後、そのスクリプトファイルを使用して変更をサーバーにアップロードします。例えば

$('#yourElement').on('input propertychange', function(){ 

     $.ajax({ 
      method: "POST", 
      url: "updatedatabase.php", 
      data: {content: $("#yourElement").val()} 
     }) 
      .done(function(msg) { 
      alert("Data Saved: " + msg); 
     }); 

    }); 

スクリプトのアップロード：

、私は「として他の誰かが使用jqueryのを言わせてくださいとすぐに私は私が考えていた、それを読んで「使用jqueryの」答え:)