[lusserPartecipante]

Ciao a tutti è da poco che uso jquery ho un problema con una dialog jquery ui 1.7.2.

ho creato la seguente funzione per la dialog:

$(function() {
	$('#dialogNote').dialog({
		resizable: false,
		dialogClass: 'no-close',
		height: 300,
		width: 500,
		modal: true,
		autoOpen : false,
		position: ['center', 'center'],
		overlay: {
			backgroundColor: '#000′,
			opacity: 0.5
		},
		buttons: {
			'CONFERMA': function() {
				var $codiceSupporto = $(this).data('codiceSupporto');
				var $note = $(this).data('note');
				$('input#codiceSupporto').val($codiceSupporto);
				$('input#note').val($note);
				$('input#note').val($('textarea#noteTextarea').val());
				//$('#formNote').submit();
				document.forms['formNote'].submit();
			},
			'ANNULLA' : function() {
				$(this).dialog('close');
			}
		},
		open: function (e, ui) {
			//valorizzo la label codice supporto
			var codiceSupporto = $(this).data('codiceSupporto');
			var note = $(this).data('note');
			$('label#codSupporto').html('Codice supporto: '+codiceSupporto);
			$('textarea#noteTextarea').html(note);
			// definisco il limite massimo di caratteri
			var limite = 255;
			var quanti = $('#noteTextarea').val().length;
			var rimasti = limite – quanti;
			// mostro il conteggio in real-time
			$('label#conteggio').html(rimasti + ' caratteri rimasti');
		}
	});
});

il problema è il seguente:

quando clikko sul pulsante “CONFERMA” non viene fatta la submit del form se non la prima volta oppure dopo numerosi click per completezza uso struts 1

 

[jqueryitaliaAmministratore]

Ciao lusser!

Occhio quando inserisci codice nei post 😉

Relativamente alla tua domanda, la soluzione è la seguente:

• al pulsante CONFERMA invece di associare la function() associa una vera e propria funzione (nel mio esempio saveData()  );
• inserisci poi il codice che intercetti il submit del form ed esegua la funzione

In pratica devi modificare il tuo codice in questa maniera:

$(function() {
   
   var myDialog, myForm;
   
   function saveData() {
      var $codiceSupporto = $(this).data('codiceSupporto');
      var $note = $(this).data('note');
      $('input#codiceSupporto').val($codiceSupporto);
      $('input#note').val($note);
      $('input#note').val($('textarea#noteTextarea').val());
      myDialog.dialog('close');
   }
		
   myDialog = $('#dialogNote').dialog({
      resizable: false,
      dialogClass: 'no-close',
      height: 300,
      width: 500,
      modal: true,
      autoOpen : false,
      position: ['center', 'center'],
      overlay: {
         backgroundColor: '#000′,
         opacity: '.5'
      },
      buttons: {
         'CONFERMA': saveData,
         'ANNULLA' : function() {
            myDialog.dialog('close');
         }
      },
      open: function (e, ui) {
         //valorizzo la label codice supporto
         var codiceSupporto = $(this).data('codiceSupporto');
         var note = $(this).data('note');
         $('label#codSupporto').html('Codice supporto: '+codiceSupporto);
         $('textarea#noteTextarea').html(note);
         // definisco il limite massimo di caratteri
         var limite = 255;
         var quanti = $('#noteTextarea').val().length;
         var rimasti = limite – quanti;
         // mostro il conteggio in real-time
         $('label#conteggio').html(rimasti + ' caratteri rimasti');
      }
   });
   
   
   myForm = myDialog.find( "form" ).on( "submit", function( e ) {
      e.preventDefault();
      saveData();
   });   
});

Buon lavoro!

[lusserPartecipante]

Ciao grazie della risposta

non riesco a capire dove mettere la submit vera e propria in saveData?

function saveData() {
   var $codiceSupporto = $(this).data('codiceSupporto');
   var $note = $(this).data('note');
   $('input#codiceSupporto').val($codiceSupporto);
   $('input#note').val($note);
   $('input#note').val($('textarea#noteTextarea').val());
   myDialog.dialog('close');
}

inserendo in questa funzione $(‘#formNote’).submit();

saluti

[jqueryitaliaAmministratore]

Non devi inserire alcuna funzione di submit, in quanto il submit stesso viene intercettato dalla funzione sottostante la definizione della modal, questo:

myForm = myDialog.find( "form" ).on( "submit", function( e ) {
   e.preventDefault();
   saveData();
});

Copia lo script che ho inserito in precedenza e vedrai che tutto funziona a dovere 😉

[lusserPartecipante]

ciao scusa se ti disturbo ancora nella pagina ho queste librerie jquery non posso modificarle

<link href="http://code.jquery.com/ui/1.7.2/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.3.2.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.7.2/jquery-ui.js"></script>

l’errore che ho con su questa linea di codice

myForm = myDialog.find( “form” ).on( “submit”, function( e ) {

è questo:

Uncaught TypeError: undefined is not a function

la dialog è la seguente:

<div id="dialogNote" title="MODIFICA NOTE" class="${style}">
   <form action="setNotaSupporto.do" method="post" id="formNote" >
      <input type="hidden" id="codiceSupporto" name="codiceSupporto"/>
      <input type="hidden" id="note" name="note"/>
  </form>
  <div style="width:100%">
      <label id="codSupporto" style="font-size:10px;font-weight:bold"></label>
      <label id="conteggio" style="font-size:10px;float:right;">255 Caratteri rimasti</label>
   </div>
   <div style="width:100%;">
      <textarea rows="4" style="width:100%" id="noteTextarea" name="noteTextarea" ></textarea>
   </div>
</div>

saluti

[jqueryitaliaAmministratore]

jQuery 1.3.2 ?!?!?!?!? o_O

Credo sia una delle primissime versioni: è ovvio che non funzioni…

[Autore]

Post