title: renaming file with jquery and php from modal window
body: <p>I am trying to rename a file from a modal window. The modal window runs fine and so does the php code for renaming the file. I have tried many different ways to send the data whithout exiting.</p>
  <p>The form gets the value of a link image: name, directory and diferent actions: delete, update and resize. So when I click the link it opens the modal window with these values (I have also noticed that the value is the same when I click other image links each time)
  The problem is that is not sending any value. I supose that there is a problem getting values:  for example val() is a jQuery method. .value is the DOM Element's property, I would like to know how can I solve this.</p>
  <p>the html code:</p>
  <pre><code>   &lt;div id=&quot;dialogo&quot; title=&quot;Editar Imagen&quot;&gt;
  &lt;p class=&quot;validateTips&quot;&gt;Campo titulo requerido.&lt;/p&gt;
      &lt;!--action=&quot;&quot; method=&quot;post&quot;--&gt;
  &lt;form id=&quot;update&quot; &gt;
  &lt;fieldset&gt;
      &lt;label for=&quot;titulo&quot;&gt;Titulo&lt;/label&gt;
      &lt;input type=&quot;text&quot; name=&quot;titulo&quot; id=&quot;titulo&quot; class=&quot;text ui-widget-content ui-corner-all&quot; /&gt;
      &lt;label for=&quot;Alt&quot;&gt;Alt&lt;/label&gt;
      &lt;input type=&quot;text&quot; name=&quot;Alt&quot; id=&quot;Alt&quot;  class=&quot;text ui-widget-content ui-corner-all&quot; /&gt;
      &lt;label for=&quot;descripcion&quot;&gt;Descripcion&lt;/label&gt;
      &lt;input type=&quot;text&quot; name=&quot;descripcion&quot; id=&quot;descripcion&quot;  class=&quot;text ui-widget-content ui-corner-all&quot; /&gt;
  &lt;/fieldset&gt;
  &lt;/form&gt;
     &lt;/div&gt;
  </code></pre>
  <p>the ajax/jquery code:</p>
  <pre><code>    &lt;script type=&quot;text/javascript&quot;&gt;
       $(document).ready(function(){
       var fname=$('a.ico-resize').attr(&quot;id&quot;);
       var directory=$('a.ico-resize').attr(&quot;rel&quot;);
       var deletecount=$('a.ico-resize').attr(&quot;value&quot;);
       $('#titulo').val(fname);
       $('#Alt').val(directory);
       var descripcion = $(&quot;input#descripcion&quot;).val();
       var dataString = 'descripcion='+ descripcion + '&amp;titulo=' + titulo + '&amp;Alt=' + Alt;
       // var data_string = $(&quot;#update&quot;).serialize();
  
  
  // Damos formato a la Ventana de Diálogo
  var dialog = $(&quot;#dialogo&quot;).dialog({
      // Indica si la ventana se abre de forma automática
      autoOpen: false,
      // Indica si la ventana es modal
      modal: true,
      // Largo
      //width: 400,
      // Alto
      //height: 280,
      // Creamos los botones      
      height: 300,
      width: 350,
      buttons: {
          
          'Rename Image': function() {
              // Mostrar Versión de PHP
              $.ajax({
                  // Antes de realizar la llamada mostramos el ajax load
                  beforeSend: function(){
                      $('#respuestaAjax').html('&lt;img id=&quot;loader&quot; src=&quot;images/loading.gif&quot;/&gt;');
                  },
                  //cache: false, // Indicamos que no se guarde en cache
                  type: 'post', // Variables GET
                  url:'rename_img.php', // srcript a ejecutar
                   data: dataString,
                   
                   //'titulo=titulo&amp;descripcion=descripcion&amp;Alt=Alt',
                   
                   //$(&quot;form#update&quot;).serialize(),
  
                   //{&quot;file&quot;:fname,&quot;directory&quot;:directory, &quot;descripcion&quot;:descripcion},  // paso de datos
                  // cuando es exitoso el llamado
                      success: function(response){
                       $('#respuestaAjax').html(response);
                      $('#' + deletecount).remove();
                          dialog.dialog( &quot;close&quot; );
                  }
              });
          },
          Cerrar: function() {
              // Cerrar ventana de diálogo
              dialog.dialog( &quot;close&quot; );
          }
      }
  });
  
       $(&quot;a.ico-resize&quot;).click( function(e) {
           e.preventDefault();
           // dialog.dialog(&quot;open&quot;);
             dialog.dialog('open');
      // prevent the default action, e.g., following a link
      return false;
            });
            });
                     
          &lt;/script&gt;
  </code></pre>
  <p>php code:</p>
  <pre><code>    &lt;?php 
  
       $dir = $_POST['Alt'];
       $file = $_POST['titulo'];
        $nuevo= $_POST['descripcion'];
       $img  = $dir.&quot;/&quot;.$file;
       $imagen =  $dir.&quot;/&quot;.$nuevo;
  
       //unlink ($img);
        rename($img, $imagen);
        echo $imagen;
        ?&gt;
  </code></pre>
  <hr />
  <h3>solved</h3>
  <p>finally all works with this code:</p>
  <pre><code>          &lt;script type=&quot;text/javascript&quot;&gt;
          
           $(function(){
            var fname=$('a.ico-resize').attr(&quot;id&quot;);
            var directory=$('a.ico-resize').attr(&quot;rel&quot;);
            var deletecount=$('a.ico-resize').attr(&quot;value&quot;);
            $('#titulo').val(fname);
            $('#Alt').val(directory);
            var descripcion = $('#descripcion').val(); 
            var data_string = $(&quot;#update&quot;).serialize();
            var dialog = $(&quot;#dialogo&quot;).dialog({
      
          autoOpen: false,    
          modal: true,    
          height: 300,
          width: 350,
          buttons: {
          
              Send: function(){
              
              str = $(&quot;#update&quot;).serialize();
                  
                  $.ajax({
                      
                      beforeSend: function(){
                          $('#respuestaAjax').html('&lt;img id=&quot;loader&quot; src=&quot;images/loading.gif&quot;/&gt;');
                      },
                      cache: false, 
                      type: 'POST', 
                      url:'rename_img.php', 
                      data: str,
                      contentType: &quot;application/x-www-form-urlencoded&quot;, 
                      success: function(response){
                          
                           $('#respuestaAjax').html(response);
                           $('#' + deletecount).remove();
                           dialog.dialog( &quot;close&quot; );
                      }
                  });
                  },
                  Cerrar: function() {
                      dialog.dialog( &quot;close&quot; );
                  }
              }
          });
  
              $(&quot;a.ico-resize&quot;).click( function(e) {
          
                var id = $(this).attr('data-id');
                var rel = $(this).attr('data-rel');
                var value = $(this).attr('data-value');
               $(&quot;#update&quot;).find(&quot;#titulo&quot;).val(id);
               $(&quot;#update&quot;).find(&quot;#Alt&quot;).val(rel);
              
              dialog.dialog('open');
          });
          });
                     
          &lt;/script&gt;
  </code></pre>