Question

In index.php theres a link where it makes a ajax request to show.php. In show.php, I took this form:

<div id="statuscomments" style="margin: auto; ">
    <form id="RespondMsg<?php echo $id; ?>" action="javascript:ReplyToWall(<?php echo $grabwall["BuID"]; ?>, <?php echo $id; ?>)" method="post">
        <textarea name="replyMsg" type="text" style="text-align: left;" class="replyMsg<?php echo $id; ?>" rows="2" cols="42"></textarea>
        <br>
        <input name="submit" type="submit" id="submitResponse" value="Skicka">
        <br>
        <div class="response<?php echo $id; ?>"></div>
    </form>  
</div>

and wrapped it inside a php function that I named replyFormShow(), now it looks like this:

function replyFormShow(){
?>
<div id="statuscomments" style="margin: auto; ">
    <form id="RespondMsg<?php echo $id; ?>" action="javascript:ReplyToWall(<?php echo $grabwall["BuID"]; ?>, <?php echo $id; ?>)" method="post">
        <textarea name="replyMsg" type="text" class="replyMsg<?php echo $id; ?>" rows="2" cols="42"></textarea>
        <br>
        <input name="submit" type="submit" id="submitResponse" value="Skicka">
        <br>
        <div class="response<?php echo $id; ?>"></div>
    </form>  
</div>
<?php
}
?>

When I call call replyFormShow() this form will now show.

Now the form is running the JS function replyToWall() on submit, but this stops working now when Its inside a function, so now it does not run the js function replyToWall().

The function replyToWall() is inside functions.js, that are not called in show.php but in index.php. But this shouldnt be why it is not working as It works fine when its not inside this PHP function replyFormShow().

Why is this happening? How can i solve this?

Answer 1

You need to have a placeholder div in your index.php, which Javascript code in show.php will place the form acquired from the server into it.

Something like this:

index.php

<div id="holder"></div>
<script type="text/javascript">
    function loadform(){
        $.get('show.php', [], function(data){
            $("#holder").html(data); // load the returned form into placeholder.
        });
    }
</script>
<a href="#" onclick="loadform();return false;"></a>

I am using jQuery for example to save time. See http://api.jquery.com/jQuery.get/ for details on the $.get() AJAX GET function in jQuery,

show.php

<?php
function replyFormShow($id, $buddyId){

$test = '<div id="statuscomments" style="margin: auto; ">
    <form id="RespondMsg' . $id . '" action="javascript:ReplyToWall('.$buddyId.', '.$id.')" method="post">
        <textarea name="replyMsg" type="text" class="replyMsg' . $id . " rows="2" cols="42"></textarea>
        <br>
        <input name="submit" type="submit" id="submitResponse" value="Skicka">
        <br>
        <div class="response' . $id . "></div>
    </form>  
</div>';
return $test;

}

echo replyFormShow(0, 0);
?>

And I see you are very confused with Javascript and PHP open/close tags. And a very bad practice to deadlock forms with Javascript.