Magical rainbow ponies

jQuery Italia - Forum » Supporto ed Aiuto » Problemi con jQuery UI

Jquery UI dialog con $.post

(2 articoli)

  1. atenea
    Membro

    salve a tutti,, sono nuova di questo forum e non ho molta pratica con jquery.

    Al momento mi sono bloccata all'utilizzo di dialog con la quale (premento un pulsante) vorrei fare una chiamata ajax usando $.post. Questo è possibile? Vi scrivo qui il codice:

    function modifica_dati(cod_articolo,id_file,titolo,descrizione){
            $("#tab_dati_file").remove();
            $( "#dialog-confirm" ).dialog({
            resizable: false,
            height:300,
            modal: true,
            buttons: {
                    "Modifica dati": function() {
                            //$( this ).dialog( "close" );
                        $.post("res/php_script/rpc_file.php",{tipo:"articolo",articolo:cod_articolo,file:id_file,titolo:$(input[name="titolo"]).val(),descrizione:$(textarea[name="descrizione"]).val()},
                        function(data){
                             alert("modifiche effettuate");
                        });
                        $( this ).dialog( "close" );
                    },
                    Annulla: function() {
                            $( this ).dialog( "close" );
                    }
            }
            });
            //$( "#dialog-confirm" ).dialog("enable");
            $("#dialog-confirm").append('<table id="tab_dati_file"><tr><td>Titolo:</td><td><input name="titolo_file" type="text" value="'+titolo+'"/></td></tr>\n\
                                            <tr><td>Descrizione:</td><td><textarea name="descrizione">'+descrizione+'"</textarea></td></tr></table>');
		$( "#dialog-confirm" ).dialog("open");
	}

<a href="#">)'>
                            <img src="res/img/design/modifica.png" alt="modifica file articolo" />
                        </a>

<div id="dialog-confirm" title="Modifica dati file" style="display:none">
	<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
            Sei sicuro di voler modificare i dati descrittivi di questo file?
        </p>
    </div>

    Nella pagina richiamata da post faccio una query.

    Il problema è che con questo codice quando clicco sul pulsante di modfica non succede assolutamente niente.

    Avete qualche suggerimento??

    Pubblicato 8 months fa #
    Private

  2. jqueryitalia
    Amministratore

    Ciao atenea e benvenuta!
    Probabilmente stai sbagliando qualcosa.
    Io ho fatto un nuovo file di test e funziona (ho usato il metodo serialize per passare i dati). Questo il codice:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css" />
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
	<script>
	$(function() {
		$("#dialog-confirm").dialog({
			autoOpen: false,
			resizable: false,
			modal: true,
			buttons: {
				'Modifica': function() {
					$.post("test.php", $("#testform").serialize());
					$(this).dialog("close");
				},
				'Annulla': function() {
					$(this).dialog("close");
				}
			}
		});

		$("#opener").click(function() {
			$("#dialog-confirm").dialog("open");
			return false;
		});
	});
	</script>
</head>
<body>
	<div id="dialog-confirm" title="Modifica dati file">
		<p style="display:block;margin:0;padding:0;font-size:12px;"><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Sei sicuro di voler modificare i dati descrittivi di questo file?</span></p>
	</div>
	<form id="testform">
	  <div><input type="text" name="a" value="1" id="a" /></div>
	  <div><input type="text" name="b" value="2" id="b" /></div>
	  <div><input type="hidden" name="c" value="3" id="c" /></div>
	  <div>
		<textarea name="d" rows="8" cols="40">4</textarea>
	  </div>
	  <div><select name="e">
		<option value="5" selected="selected">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
	  </select></div>
	  <div>
		<input type="checkbox" name="f" value="8" id="f" />
	  </div>
	  <div>
		<input type="submit" name="g" value="Submit" id="opener" />
	  </div>
	</form>
</body>
</html>
    Pubblicato 8 months fa #
    Contact us

RSS feed for this topic

Replica

Devi aver fatto il login per poter pubblicare articoli.