开发者

jquery ui button screwed up when AJAX loads it

I have a problem with the jquery ui button (I think).

I try to load an inbox via AJAX, I got all the data and css but somehow the script with the jquery button does not work.

I got my page structured as followed:

ob_start();
session_start();
if(isset($_SESSION['rol']))
{
    if(isset($_POST['getnewmail']))
    {
        //Do some query stuff here
        //Print the output through a foreach...
        echo '<div class="jbutton">';
        foreach($result as $key => $value)
        {
            foreach($value as $y => $mailid)
            {
                //echo the stuff
            }
        }
        echo '</div>';
    }
}

As you can guess I call the the jquery code upon the div before the foreach. The code for that is:

$(function() {
    $("button, a", ".jbutton").button();
});

My AJAX code sets the $_POST['getnewmail'].

function loadinbox(serverpage, contentid)
{
    var xmlhttp = ajaxFunction();
    if (xmlhttp)
    {
        var params = "getnewmail=settrue";
        var url = "/location/php/" + serverpage;
        xmlhttp.open("POST", url, true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.setRequestHeader("Content-length", params开发者_运维问答.length);
        xmlhttp.setRequestHeader("Connection", "close");
        xmlhttp.onreadystatechange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
               if(xmlhttp.responseText != "")
               {
                    document.getElementById(contentid).innerHTML=xmlhttp.responseText;
                    return;
               }
            }
        }
        xmlhttp.send(params);
    }
}

The problem is when I try to load the mails into the inbox without AJAX I get what I want.

But when I move the code into an if statement and call it with AJAX it all fails.

Can somebody explain me what I am doing wrong? Why does jquery ui button not work when loaded into a div with AJAX? While it does work when loaded trough normal php and without AJAX.

UPDATE:

http://img35.imageshack.us/i/30fkdl30.png/

Here is an image to clarify what the problem is.


From what I can tell, the javascript code is called before the div content is received from the server. You should call the .button() after you set the innerHtml propery of the div.


Thanks, that worked for me too. Here what I got at the end:

First, we send AJAX response, and second, we re-initialize all buttons.

xmlhttp.onreadystatechange=function()
{
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
        document.getElementById("users-contain").innerHTML=xmlhttp.responseText;

        //recall JQeuryUI buttons initialization.
        $("input:submit", ".demo" ).button();

     }

}

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜