include javascript file in php

Question

I have an html file(index.html) which calls a php file(pdj.php) via javascipt and populates the output in a div(pdj). This works.

$.ajax({
     url: '../command/pdj.php', 
     type: "POST",
     data: ({xparam: xparam}),
     success: function(data){
         var arraydata = $.parseJSON(data);          
      $("#pdj").html(arraydata[0]); 
     }
});

The php file needs a javascript file(spinner.js) to work.

1) Adding the javascipt file in index.html does not use it.

2) Including in pdj.php causes an error include_once('spinner.js');

Uncaught SyntaxError: Unexpected token / in JSON at position 1
    at Function.parse [as parseJSON] (<anonymous>)
    at Object.success (pdj.js:40)
    at fire (jquery-3.3.1.js:3268)

I am guessing my ajax call is wrong... Can you suggest how to fix this?

Thanks in advance

How about add datatype : "application/json", in your ajax call ? — Zar Ni Ko Ko
– Zar Ni Ko Ko, Commented Jun 16, 2020 at 9:59
include and include_once is there for read and evaluate php code docs include - not javascript! — Michal Miky Jankovský
– Michal Miky Jankovský, Commented Jun 16, 2020 at 11:42

Tian Ming · Accepted Answer · 2020-06-16 17:27:26Z

1

Your ajax call is not wrong.

1) Adding the javascipt file in index.html does not use it.

Problem here is that when the javascript file is executed, it can't find the target because the ajax call is not yet executed which means the DOM object is not yet created for the spinner.js.

2) Including in pdj.php causes an error include_once('spinner.js');

Here include_once will just add the javascript file's content to the response and this results the broken json and that's why the ajax fails because the content-type is set to application/json in you ajax config

The solution is to call the spinner.js's function on ajax success handler.

If you can provide the spinner.js as a link, that would be better for the answer.

$.ajax({
     url: '../command/pdj.php', 
     type: "POST",
     data: ({xparam: xparam}),
     success: function(data){
         var arraydata = $.parseJSON(data);          
         $("#pdj").html(arraydata[0]); 
         $("input[type='number']").inputSpinner();
     }
});

edited Jun 16, 2020 at 17:27

answered Jun 16, 2020 at 9:59

Tian Ming

1511 silver badge8 bronze badges

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

6 Comments

osieman Over a year ago

Thanks for answering... the spinner.js can be found here [link]github.com/shaack/bootstrap-input-spinner/blob/master/src/…

osieman Over a year ago

I have this javascript code which calls the master file: $("input[type='number']").inputSpinner();

Tian Ming Over a year ago

Yeah, call this function on the ajax call success handler

osieman Over a year ago

I tried but got an error '$.ajax({ url: '../command/pdj.php', type: "POST", data: ({xparam: xparam}), success: function(data){ $.getScript("../js/bootstrap-input-spinner.js"); var arraydata = $.parseJSON(data); $("#pdj").html(arraydata[0]); } }); ' $("input[type='number']").inputSpinner(); error=:Uncaught TypeError: $(...).inputSpinner is not a function

osieman Over a year ago

formatting looks bad.. but I added an extra line to the success in ajax.. the line was this ' $.getScript("../js/bootstrap-input-spinner.js");' but it did not work.

|

Collectives™ on Stack Overflow

include javascript file in php

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related