-1

I'm pulling a module from our Joomla site to host onto our local servers and put back into Joomla as an iframe. I've gotten the source code, set up the database to mirror that of the Joomla. When I try to do a search, I get this error:

Uncaught TypeError: Cannot read property 'HTML' of undefined

This is the js that is being called:

// Functon to perform the actual search based on Method
function displayMethod(searchText, pageNumber) {
    var jqxhr = jQuery.ajax("index.php?option=com_ppsearchusd&view=ppsearchusd&task=displayMethod&format=json&searchText=" + searchText + "&pageNumber=" + pageNumber)
        .success(function (result) {
            jQuery('#searchResults').html(result.data.HTML);
            jQuery('#alphaDiv').css('display', 'none');

            /*jQuery('#searchResults').html(result.data.HTML);
            jQuery('#searchResult-detail').css('display', 'none');
            jQuery('#searchResults').css('display', 'block');
            jQuery('#alphaDiv').css('display', 'none');*/

            jQuery('#searchResults #search-pagination').pagination({
                items: result.data.items,
                itemsOnPage: result.data.itemsOnPage,
                currentPage: result.data.currentPage,
                cssStyle: 'compact-theme',
                hrefTextPrefix: 'javascript:',
                onPageClick: function(pageNumber, event){
                    var searchText = jQuery('#searchTXT').val();
                    updateSearch(searchText, pageNumber);
                }
            });
        })
        .fail(function (jqxhr) {
            alert('status:' + jqxhr.status);
        });
}

If I copy the ajax url and append it (on my local machine) url, it get a blank page, whereas on the actual site, I do get a success JSON response. I'm sure I'm missing something that it is suppose to reference but I'm not sure what. I'm still relatively new to AJAX and js. I'm reviewing the original code and I'm not sure where "HTML" within the

jQuery('#searchResults').html(result.data.HTML);

is defined but I don't see.

  • What does console.log(JSON.stringify(result)); say if write on the line immediately after .success? Are you serving data from php using echo new JResponseJson($result);? <--what does that $result look like? – mickmackusa Oct 29 '18 at 13:48
  • I get an uncaught syntaxError: unexpected token new when placing the "echo new JResponseJson($result);" for the "console.log(JSON.stringify(result));" this is the response I get: ""<!doctype html>\r\n<html lang=\"en\">\r\n\t<head>\r\n\t<!-- Required meta tags -->\r\n\t<meta charset=\"utf-8\">\r\n\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\r\n\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=10\" />\r\n\r\n\t<title>\r\n\tTest Menu\r\n\t</title>\r\n<script src=\"ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js\"..." – Yodavish Oct 29 '18 at 14:13
  • What did you change exactly? I requested a few different details. – mickmackusa Oct 29 '18 at 14:15
  • Sorry, I accidentally hit enter before I was ready to add the comment. I've updated it now. – Yodavish Oct 29 '18 at 14:17
  • Is there an error message buried down the ...? Where did you write the echo new JResponseJson($result);? Can we see that part of your code? What does the data structure look like that you are passing to echo new JResponseJson();? I'd like to know where the HTML key is in the data. – mickmackusa Oct 29 '18 at 14:19
1

When my helper.php file passes data back to the ajax call, with:

echo new JResponseJson($response);

I parse the response like this:

.success(function (result) {
    result = JSON.parse(result);

Then you can access HTML data with: result.data.HTML

Relevant resource: https://docs.joomla.org/JSON_Responses_with_JResponseJson

When I first "came to Joomla" in March of 2018, I needed to write my first ajax driven module. @JamesGarrett got me going with this great answer. (and Lodder gave me great advice too)


A note about deprecation from http://api.jquery.com/jquery.parsejson/

As of jQuery 3.0, $.parseJSON is deprecated. To parse JSON strings use the native JSON.parse method instead.

  • I up voted this because of a great, simple, linked resource on AJAX calls/responses using this Class within Joomla. Very helpful doc. Thanks! – Zollie Oct 29 '18 at 17:00
0

Have you copied the full Joomla site to your local server, or only a module from the live site?

I mean, on your local server where the Joomla is running(?), is there a component also installed which is called "com_ppsearchusd"? (This component is called in the AJAX request above). It looks like that the AJAX call does not find the component (and the requested task) on your local server. That way it cannot work...

The full component with the view, model, controller, helper, or any other component folders should be on your local Joomla to get the AJAX call correctly and it will give the correct response on the request.

After clearing the real problem:

After you explained what you are up to with this and where and how you try to run this jQuery AJAX request, it became relevantly clearer why this was not working for you (the given error message does not matter here at all).

With this AJAX call you actually call the function inside "com_ppsearchusd" component where you should find the requested function which is called displayMethod(). You should find this Joomla/PHP function most probably inside the 'controller' file (which is the controller of the above mentioned component). This function is what you have to focus on and make this function work on your local server. And this is the function you should call via the jQuery AJAX call *(not like you did with this line (this has to be reformulated line in the jQuery code):

var jqxhr = jQuery.ajax("index.php?option=com_ppsearchusd&view=ppsearchusd&task=displayMethod&format=json&searchText=" + searchText + "&pageNumber=" + pageNumber)*

This above AJAX call, this way, will never work on your server if your local server is not running Joomla itself. This is also a very problematic call from another/external server.

The requested, mentioned function from the Controller most probably invokes a function from the Model and then gets the data from the Database and then gives it back as a response data (as result), just to cover the whole cycle of this jQuery call (and that's how 'HTML' finally becomes defined). So you see, a lot of dependencies. It is not just about stripping down a Joomla module.

(a small additonal issue: another problem you might be facing is a security issue, after you solved the above jQuery call. Since usually every AJAX call inside Joomla carries a security token (CSRF token) which is created and carried with the AJAX call and checked by Joomla inside the called function. This security issue is solved within Joomla, but I am not sure how it is solved on your local server without Joomla, but you will figure that out probably if it becomes an issue at all) So it is still a question for me that the response on the AJAX call will be given from your local server or from the live Joomla site server? I do not see this clear yet in your project. Of course the logical answer is that the response will be given from where the called function is. This is a bit confusing subject... for anybody. But I just hope this can show you some direction in this question.

  • Just the module only that is on my local machine we want to take the module and strip it down to run on own servers, and then have the URL to put into an iframe on the Joomla server. I do have the ppsearchusd.php file but not the com_ppsearchusd folder. I'll pull that folder over too and see if that helps a bit more. the ppserachusd.php has a lot of reference to Joomla code such as "$db = JFactory::getDbo(); $db->setQuery($query); $db->execute();" That I guess I need to convert over to regular PHP. – Yodavish Oct 29 '18 at 15:36
  • Thus, that is your main problem in the first place (as far as I can see it from here). In Joomla you cannot make an AJAX call just to somewhere this way... – Zollie Oct 29 '18 at 15:41
  • In order to get this work, I guess I'll have to adjust the source code to take away the Joomla codes within the com_ppsearchusd folder? There are 3 main files within there. view.ajax.php, controller.php, and ppsearchusd.php that I'll have to just take my time to adjust those files. – Yodavish Oct 29 '18 at 15:48
  • The full component should be copied. From the 'administrator/components' folder and from the normal 'components' folder either. Actually the full component should be installed on your local server (Joomla) too. I still do not fully see your full project (why and how and what) but you will give some more info as you are proceeding with this and we will see how it works... – Zollie Oct 29 '18 at 15:51
  • Well to fully explain we are testing out Wordpress and need the Test Menu module which is a search application, that was design to work under Joomla (and then passed on to me). We want to strip down this module, so that it can work on our own server, under Windows IIS. That way we can just copy the URL and put it in the iframe of Joomla and WordPress. I've copied over the './components/com_ppsearchusd' already. – Yodavish Oct 29 '18 at 16:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.