How to get input value to modal box jquery UI

Question

<div id="befor-box">
   <form id="newsletter-form" name="newsletter-form" action="/sub/" method="post">{% csrf_token %}
      <input name="email" type="text" value="Enter your Email here" class="text"/> 
      <input class="submit" onclick="showDialog();" value="Subscribe!" />
   </form>
</div>

How to get EMAIL value from:

<input name="email" type="text" value="Enter your Email here" class="text"/>

to:

<input name="email" type="text" value="" class="text"/>

from here:

<div id="dialog-modal" style="display:none;">
   <form name="newsletter-form" action="/sub/" method="post">
      <input name="email" type="text" value="" class="text"/>
      <input name="fname" type="text" value="First name" class="text"/>
      <input name="lname" type="text" value="Last name" class="text"/>
      <input type="submit" class="submit" value="Subscribe!" />
   </form>
</div>
<script type="text/javascript">
   function showDialog()
   {
   $( "#dialog-modal" ).dialog({


   });
   }
</script>

Answer 1

use open event of dialog which is called whn dialog opens... so replace the value there..

$( "#dialog-modal" ).dialog({
 open: function( event, ui ) {
     var boxInput=$("#befor-box").find('input[name="email"]').val(); //get the value..
     $("#dialog-modal").find('input[name="email"]').val(boxInput); //set the valu

 }
});