CODEWITHSUNDEEP
phpjquery
Joel Rosen
Joel Rosen

Reputation: 157

How to use php value in jQuery function

I have a php file which uses a script within it.

I'm trying to get an image called by php (the_main_image) and prepend a set of links with this image (along with a favicon which is currently working fine) using jQuery. Here's what I have so far but it currently breaks the function

<script>
    jQuery(document).ready(function($) {

        $("#lesen").click(function() {

            var bla = $('#my_hidden_input').val();
            var test = "<?php the_main_image(); ?>";

        $.ajax({
            url: bla,
            dataType: "text",
            success: function(data) {
                $(".text").html(data);
                $(".text a[href^='http']").each(function() {

                    $(this).prepend(test);
                    $(this).prepend('<img src="https://www.google.com/s2/favicons?domain=' + this.href + '">');



                });
            }
        });
    });

});
</script>

How can I use jQuery var values that contain php within a prepend or other similar jQuery functions?

Upvotes: 1

Views: 1613

Answers (3)

Kevin Rhema Akhwilla
Kevin Rhema Akhwilla

Reputation: 105

Try to use ajax to get php value in jquery funcion.

Upvotes: 0

valdislav
valdislav

Reputation: 26

If your function in php does not echo result. Try to add echo. <?php echo the_main_image(); ?>. Seems like you forgot to echo result.

P.S. You can render results from php, even use it inside js code that placed in php files, but you should remember that mixin php with js is bad practice, and should be done cautiously.

How it works: php interpreter read your file before send static html to user and interpret all php related cod inside <?php ?>, if you echoing something it will appears in that row where you do this (or call function than do echoing). As mentioned by somebody if you echoing string with quotes it can break the js if you inline your php tags inside the same type of quotes.

Upvotes: 1

user9081948
user9081948

Reputation:

Hi I have done similar thing in my project, below worked for me.

Since you cannot write php directly in JavaScript, you need take help of your html.

Create a hidden input field in you html like below

<input type="hidden" id="something" value="<?php the_main_image(); ?>"/>

Then read this in jquery like 

<script>
    jQuery(document).ready(function($) {

        $("#lesen").click(function() {

            var bla = $('#my_hidden_input').val();
            var test = $("#something").val();

        $.ajax({
            url: bla,
            dataType: "text",
            success: function(data) {
                $(".text").html(data);
                $(".text a[href^='http']").each(function() {

                    $(this).prepend(test);
                    $(this).prepend('<img src="https://www.google.com/s2/favicons?domain=' + this.href + '">');



                });
            }
        });
    });

});
</script>

hope this helps.

Upvotes: 2

Related Questions