How to add/append PHP + HTML code in JQuery .append()

Question

I'm trying to append PHP code in Jquery. I'm getting confused in the quotation marks and not getting correct result.

below code.

  <script>
    $(document).ready(function(){
        $("#add").click(function(event){
             event.preventDefault();
             //var text_box = "<br>Fee type: <input type='text' name='f1[]'>amount : <input type='text' name='f2[]'><br>";
             var text_box = "<?php
                        #Fee type textbox
                            if(form_error('feetype'))
                                echo "<div class='form-group has-error' >";
                            else
                                echo "<div class='form-group' >";
                        ?>
                            <label for='feetype' class='col-sm-2 control-label'>
                                <?=$this->lang->line('invoice_feetype')?>
                            </label>
                            <div class='col-sm-6'>
                                <input type='text' class='form-control' id='feetype' name='feetype[]' value='<?=set_value('feetype')?>' >
                            </div>
                            <span class='col-sm-4 control-label'>
                                <?php echo form_error('feetype'); ?>
                            </span>
                        </div>";
            $("#info").append(text_box);
        });
<script>

first rule of programing know your programming languages , you can't execute php on the client side — madalinivascu
– madalinivascu, Commented Apr 6, 2017 at 7:52
the code will added as a plain text. not as you want (that it will be added and executed as well) — Death-is-the-real-truth
– Death-is-the-real-truth, Commented Apr 6, 2017 at 7:54

Douglas Hosea · Accepted Answer · 2017-04-06 11:37:45Z

1

You can use an AJAX call to execute a PHP script on the server. So, for your if statements, just send the variables with conditions to be tested to a php script via ajax and php will return the html code of the div which you can then append to an element.

As an example for your first div;

You can set up an ajax call like;

<script>
    $(document).ready(function(){
        $("#add").click(function(event){
             event.preventDefault();

            var part;
            var test = 'feetype';

            $.ajax({
         type: 'POST',
           url: "get_div.php",
           data: {test:test},
           success: function(result){
               part = result;
           }
     })

var text_box = part + "<label for='feetype' class='col-sm-2 control-label'>"
/***
all other code here
***/
</script>

Then in your php script

<?php
    #Fee type textbox
    if(form_error($_POST['test']))
     echo "<div class='form-group has-error' >";
    else
     echo "<div class='form-group' >";

Let me know if it helps or if you find a problem.

edited Apr 6, 2017 at 11:37

answered Apr 6, 2017 at 8:10

Douglas Hosea

1,02214 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Jasshh Andrews Over a year ago

the php code is used between as well. it is not limited to if condition. how to get values from another page. i'm stuck

Jasshh Andrews Over a year ago

its working fine. but it is only executing once ... I have placed the code in head section

Douglas Hosea Over a year ago

Hey, please note that it is always a good practice to place javascript code at the end of the document before the closing body tag. First try to place it exactly before the closing body tag i.e </body>

Jasshh Andrews Over a year ago

Still the same. It is getting executed only once.

Douglas Hosea Over a year ago

Hey, try to troubleshoot the click listener to see if it responds after clicking more than once by setting up an alert("anything") to see if it is called. You can try to find out exactly which function or what part of code is not running by setting by alerts but i really can't tell what the problem might be unless i look at the code.

Collectives™ on Stack Overflow

How to add/append PHP + HTML code in JQuery .append()

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related