fancybox, ajax, formular, nette.js

David Ďurika

chcem spravit edit form cez fancyBox, ajaxom chcem natiahnut cely form (ide to na ten isty prezenter len akcia sa meni)

ale robi mi to taku haluz ze ajaxom mi pride form (vidim ho vo fire bagu) ale sa mi vobec nevikresli… ked si tam ten ajax nacitat v novom okne tak sa mi form zobrazi

a ked si NEnacitam nette.js tak mi to funguje aj cez ajax ( ale prestanu my fungovat ine veci kt. vyuzivaju ten nette.js)

Ani

Chce se to vypořádat s řádkem dataType: „json“ v nette.js, třeba ho smazat.

<script>
jQuery.ajaxSetup({
	success: jQuery.nette.success,
	dataType: "json"
});
</script>

David Ďurika

aha, zabralo, dik!

a nebude to tam niekomu chybat?

JakubJarabica

Achtan: Akym sposobom realizujes vykreslenie formulara do modalneho okna? Mne totiz aj bez odmazania dataType: json funguje render vybraneho snippetu do modalneho okna(aj aj nasledne ajaxove odosielanie). Len som na to trosku priohol jquery.nette.success a updatesnippet metody.

JDC

Mám podobný problém, akorát mě to natvrdo háže ten neparsovaný json do toho fancyboxu, takže ve výsledku to zobrazí jen hromadu nesrozumitelného bordelu. v Document ready mám:

<script>
  $(".fancy").fancybox({type: 'ajax'});
</script>

a pak mám ještě nastavení ajaxu pro nette:

<script>
//AJAX
jQuery.extend({
    nette: {
        updateSnippet: function (id, html) {
             $("#" + id).fadeTo("fast", 0.01, function () {
        $(this).html(html).fadeTo("slow", 1);
    });
        },

        success: function (payload) {
            // redirect
            if (payload.redirect) {
                window.location.href = payload.redirect;
                return;
            }

            // snippets
            if (payload.snippets) {
                for (var i in payload.snippets) {
                    jQuery.nette.updateSnippet(i, payload.snippets[i]);
                }
            }
        }
    }
});

jQuery.ajaxSetup({
    success: jQuery.nette.success
});

$(function () {
    // vhodně nastylovaný div vložím po načtení stránky
    $('<div id="ajax-spinner">xcv</div>').appendTo("body").ajaxStop(function () {
        // a při události ajaxStop spinner schovám a nastavím mu původní pozici
        $(this).hide();
    }).hide();
});

$("a.ajax").live("click", function (event) {
	    event.preventDefault();
	      // zobrazení spinneru a nastavení jeho pozice
	    $("#ajax-spinner").show().css({
		position: "absolute",
		left: "39%",
		top: "43%"
	    });

	    $.get(this.href);


});
</script>

Nějak musí jít ten json parsovat pro Fancybox a vymáčknout z něj to html. Bohužel se mi nenachází najít řešení, jelikož se v ajaxu u nette moc nevyznám, respektive dělá mi značný problém pochopit, jak je to s tím jquery a nette ajaxem myšleno a jakým způsobem parsuje snippety z toho jsonu.

Vím, je to trochu outdated vlákno, ale nechtělo se mi zakládat kvůli tomu nové, když už se tu skorostejný problém jednou řešil.

EDIT: Tak jsem to nějak pořešil pomocí následujícího skriptu, nicméně přád se to chová divně. Dost mi to rozháže styl a nefunguje live-form-validations (vlastně ani sama vestavěná JS validace na straně klienta nefunguje vůbec), jelikož to nechává mezí tím html nějaké části jsonu a to by bylo k zbláznění je tímto způsobem z toho parsovat. Možná, že to ani nejde, ale to jsem už nezkoušel.
EDIT: Problém se stylama CSS vyřešen, ovšem problém s JS validací stále přetrvává.

<script>
 $(".fancy").fancybox({type: 'ajax', afterLoad: function(payload) {
	  var obj = jQuery.parseJSON(payload.content);
	  this.content = "";
	  for (var i in obj.snippets) {
                    this.content += obj.snippets[i];
                }
	  //alert(obj.snippets["snippet--prihlasit"]);

  }});
</script>

Editoval JDC (24. 5. 2013 3:22)