jQuery ajax pomoc

jQuery ajax pomoc 11.11.2010. u 10:11 · pre 194 meseca #1

Ovako imam jednu html stranicu: poziv.html i u njoj imam

Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery AJAX</title>
<script type="text/javascript" src="/public/scripts/lib/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
function startAjax(){
    $.ajax({
           type: "POST",
           url: "server.php",
           data: "post_id=1",
           success: function(msg){
           document.getElementById('prikaz').innerHTML = msg;
           }
         });
}
</script>
</head>
<body>
<div id="prikaz"></div>
<button onclick="startAjax();">Start</button>
</body>
</html>

Ova funkcija startAjax() ovako izgleda:

Code:

    $.ajax({
           type: "POST",
           url: "server.php",
           data: "post_id=1",
           success: function(msg){
           document.getElementById('prikaz').innerHTML = msg;
           }
         });

Stranica server.php izgleda ovako:

Code:

<?php
$content = "<script type='text/javascript'>document.write('Neki Java Script koji treba da se izvrsi');</script>";
$content .="<br />Primljeni parametar je:". $_POST['post_id'];
echo $content ;
?>

E sada ja sam ocekivao kada se klikne na dugme Start da ce na stranici prikaz.html u divu id="prikaz" da se ubaci tekst "Neki Java Script koji treba da se izvrsi. Primljeni parametar je: 1"

Medjutim pojavljuje se samo tekst "Primljeni parametar je: 1". Sto znaci da se u vracenom html-u koji sam upisao u div ne izvrsava java script. Cak kad bi u u tom html pozvao neku funkciju iz jQuery-ija on je ne bi video jer ne vidi include jQuerija iz hedera prikaz.html

Da li neko moze da mi objasni u cemu je problem, i kako da resim ovo?

Potpis

djLapac

Re: jQuery ajax pomoc 11.11.2010. u 10:49 · pre 194 meseca #2

Logika ti je potpuno pogrešna... Zašto na serverskoj strani definišeš nešto što treba da izvrši klijent (JS)? Bolje je da PHP vrati samo neki "podatak" (šta god to podrazumevalo), a da JS onda na osnovu toga odluči šta treba dalje raditi.

I druga stvar, kad već koristiš jQuery, šta će ti onda document.getElementById() notacija? Zarad konzistentnosti tvog kôda trebao bi da korisiš jQuery selektore, u tvom slučaju id selector. Takođe, onclick, i uopšte bilo koji event u liniji tag-a je nešto što je odavno prevaziđeno. click događaj možeš da bind-uješ i spolja: http://api.jquery.com/click/.

Re: jQuery ajax pomoc 11.11.2010. u 10:50 · pre 194 meseca #3

document.write se izvršava samo pri inicijalizovanju stranice.
Ako si hteo da izvršiš neki JS probaj ovako:

Code:
<script type='text/javascript'>setTimeout("alert('Neki Java Script koji treba da se izvrsi');",10);</script>

Mada, ako već server treba da ti vrati dve vrste sadržaja, jedan kao HTML i jedan kao JS, bolje je da ta dva (ili više) podatka spakuješ u JSON kao array('html'=>$TvojHtmlKod, 'js'=>$TvojJsKod) pa bi onda ajax poziv ovako izgledao:

Code:
$.ajax({
.
.
dataType: 'json',
success: function(data) {
$('#prikaz').html(data.html);
if (data.js) setTimeout(data.js, 50);
},
.
.

Potpis

_{"The quieter you become, the more you are able to hear."}
Blog | PowerCMS

Re: jQuery ajax pomoc 11.11.2010. u 11:11 · pre 194 meseca #4

Ja sam ovo pojednostavio stvari, da bih video gde gresim u startu, a evo sta meni predstavlja problem:
Ja na stranici prikaz.html u headu includujem sledece:

Code:

<script type="text/javascript" src="/public/scripts/lib/jquery-1.4.2.min.js"></script>
<script  type="text/javascript" src="/public/scripts/jquery.metadata.js"></script>
<script type="text/javascript" src="/public/scripts/jquery.validate.js"></script>
<script type="text/javascript">
$().ready(function() {
    var container = $('div.container');
    var validator = $("#html_form").validate({
        errorContainer: container,
        errorLabelContainer: $("ol", container),
        wrapper: 'li',
        meta: "validate"
    });

    $("#resetButton").click(function() {
        validator.resetForm();
        document.html_form.reset();
    });
});
</script>

<script type="text/javascript" src="/public/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
    mode : "specific_textareas",
    textarea_trigger : "convert_this",
    theme : "advanced",
    theme_advanced_buttons1 : "bold,italic,underline,separator,bullist,numlist, undo,redo,link,unlink,pastetext,cleanup,fullscreen",
    theme_advanced_buttons2 : "",
    theme_advanced_styles : "Page=pageLink",
    plugins : "paste,fullscreen",
    convert_newlines_to_brs : true,
    valid_elements : "a[href|target=_blank],strong/b,br,p,em,i,u,li,ol,ul",
    force_br_newlines : true,
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    fullscreen_new_window : true,
    fullscreen_settings : {
        theme_advanced_path_location : "top"
    }
});

</script>

E sada u ovom kodu koji mi vraca server.php je u stvari html forma koja u sebi ima jedno tekstarea polje za koje bi trebalo da se inicijalizuje ovaj tinyMCE editor, takodje trebala bi i da radi se validacija forme

Code:
<div class="container">
    <ol>
        <li><label for="firstname" class="error"><img src="/public/images/icon/icon_err.gif" alt="error" border="0" /> Unesite ime</label></li>
        <li><label for="lastname" class="error"><img src="/public/images/icon/icon_err.gif" alt="error" border="0" /> Unesite prezime.</label></li>
        <li><label for="email" class="error"><img src="/public/images/icon/icon_err.gif" alt="error" border="0" /> Molimo Vas unesite ispravnu email adresu.</label></li>
        <li><label for="username" class="error"><img src="/public/images/icon/icon_err.gif" alt="error" border="0" /> Unesite korisnicko ime.</label></li>
                <li><label for="description" class="error"><img src="/public/images/icon/icon_err.gif" alt="error" border="0" /> Unesite opis.</label></li>
    </ol>
</div>
<form id="html_form" name="html_form" action="/" method="post">
<input type="hidden" name="edit_id" id="edit_id" value="1" />
<fieldset>
<label for="firstname">Ime</label>
<input type="text" name="firstname" id="firstname" class="input {validate:{required:true}}" value="" />
<label for="lastname">Prezime</label>
<input type="text" name="lastname" id="lastname" class="input {validate:{required:true}}" value="" />
<label for="lastname">Email</label>
<input type="text" name="email" id="email" class="input {validate:{required:true, email: true}}" value="" />
<label for="lastname">Korisnicko ime</label>
<input type="text" name="username" id="username" class="input {validate:{required:true}}" value="" />
<label for="description">Opis</label>
<textarea name="description" id="description" class="input {validate:{required:true}}" convert_this="true" onpaste="return false"></textarea>
<p class="clear"> </p>
<input type="submit" name="submit" value="Potvrdi" class="submit"  /><button type="button" id="resetButton" class="reset">Ponisti</button><button type="button" class="cancel">Odustani</button>
</fieldset>
</form>

Medjutim problem je sto ovaj html kod kada se upise u ovaj div "prikaz" on uopste ne vidi includovanje scripta iz heada strane i tako da ne radi ni inicijalizacija tinyMCE editor niti validacija forme.

To me muchi.

Potpis

djLapac

Re: jQuery ajax pomoc 11.11.2010. u 17:12 · pre 194 meseca #5

Ipak greška u koracima, bio je Nikola u pravu.

Problem ti pravi to što ti se inicijalizacija TinyMCEa odvija u inicijalizaciji cele stranice, a ti posle ajaxom pregaziš to.

Obrati pažnju TinyMCE radi tako što tvoju textarea-u učini nevidljivom a iza njega doda span sa dugmadima i iframe za prikaz sadržaja, i tokom rada kopira sadžaj iframe-a u tvoju textareu. To ne diraj.

Proizvođač ima dobar forum, sećam se da je bilo dosta pitanja kako inicirati editor "on demand", pogledaj šta im je odgovoreno.

Ja sam koristio javascript funkciju tinyMCE.execCommand("mceAddControl", false, "MojaTextarea");
da bi naknadno (kroz) ajax inicirao editor.

Potpis

_{"The quieter you become, the more you are able to hear."}
Blog | PowerCMS

Re: jQuery ajax pomoc 11.11.2010. u 17:36 · pre 194 meseca #6

Ok. hvala puno

Potpis

djLapac

Forum kao aplikacija na telefonu

Srodne teme