title: Updating an html "value" with a jquery variable
body: <p>So i'm building a messaging application in which a user clicks on a button, a jquery prompt is displayed asking for the user to type in their message, and then ideally the message is sent using a separate ajax function. </p>
  
  <p>Here is the code in question:</p>
  
  <p>jQuery message prompt function:</p>
  
  <pre><code>        function getInput() {
           var text = prompt("Enter message", "");
  
              if (text != null) {
              document.getElementById("demo").innerHTML = text; //failed attempt at updating the value just using the id of the input. 
              }
      }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form name="messagesend" method="post" onsubmit="return sendMessage(this);"&gt;   
  &lt;input type="hidden" id="demo" name="message" value="I want to update this field with the result of the javascript text variable" /&gt;
  &lt;input type="hidden" name="regId" value="&lt;?php echo $row["gcm_regid"] ?&gt;"/&gt;
  &lt;input type="submit" class="send_btn" value="Volume-Vibrate" onclick="getInput()"/&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>As you can see, the field I want to update is the string contained in <code>value</code> which is the message being sent. How could I get that to update with the result of whatever the user puts in the text prompt?</p>
  
  <p>Any help would be greatly appreciated!</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>Updated jQuery function to the following:</p>
  
  <pre><code>        function getInput() {
           var text = prompt("Enter message", "");
  
              if (text != null) {
                  $("#demo").val(text);
              }
      }
  </code></pre>
  
  <p>This may be a different question, but when the button that is created in the HTML I originally posted is clicked, it displays the prompt and I type in a message, but the default value that I placed is still the message being sent. Is </p>
  
  <pre><code>onsubmit="return sendMessage(this);"
  </code></pre>
  
  <p>Being executed before the jQuery is updating the value field? And if so, is there anyway to fix that?</p>
  
  <p>If it helps, here is <code>sendMessage</code> which uses ajax to send off the message to a php script.
  The HTML <code>value</code> field (which I'm trying to get to be the user-input string from the jQuery prompt using <code>getInput()</code>) becomes the <code>data</code> variable, which also contains the registration id of the designated recipient of the message. </p>
  
  <pre><code>        function sendMessage(formObj){
              var data = $(formObj).serialize();
              $(formObj).unbind('submit');                
              $.ajax({
                  url: "send_message.php",
                  type: 'GET',
                  data: data,
                  beforeSend: function() {
  
                  },
                  success: function(data, textStatus, xhr) {
                        $('.txt_message').val("");
                  },
                  error: function(xhr, textStatus, errorThrown) {
  
                  }
              });
              return false;
          }
  </code></pre>