We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 44195
    • 293 Posts
    Hi,

    I'm working on a custom component and most of the back end is done I'm just trying to display the data in an appropriate way on the front end now.

    I have a database table of competitions which is being output as a paginated list of links.
    Clicking on one of these links should take the user to the paginated output of my 'artworks' database table.

    I'm interested to know how I would pass the competition id from one resource to another so that only the artworks from the appropriate competition are displayed.

    My 'home' resource implements getPage with the following:
    [[!getPage? 
        &elementClass=`modSnippet` 
        &element=`competitionList` 
        &totalVar=`total`
        &tpl=`competitionListRowTpl` 
        &limit=`1`
    ]]
    <div class="pageNav">[[!+page.nav]]</div>
    


    My "competitionListRowTpl" is:
    <a class="competition-link" data-competitionid="[[+id]]" href="">[[+competitionname]]</a>
    


    and then some custom JQuery code on the template to take the 'data-competitionid' value:
    $(document).ready(function() {
        if($(".competition-link").length > 0) {
    	$(".competition-link").click(function(event) {
    		event.preventDefault();
    		var competitionId = $(this).data('competitionid');
    		$(".competition-link").remove();
    		$(".pageNav").remove();
    		$("#main-wrapper").load('[[~5]]', competitionId); // I'm just chucking competitionId in here as an assumption
    	});
        }
    });
    


    [[~5]] is a resource that calls Bruno's ajaxGetPage snippet and I want to use the the competitionId that was clicked on previously to load the correct artworks.

    Is the type of thing I'm trying to do at all possible? I'm a bit lost in this aspect of MODx.
    Any and all advice appreciated wink

    Cheers!

    This question has been answered by sottwell. See the first response.

      I'm lead developer at Digital Penguin Creative Studio in Hong Kong. https://www.digitalpenguin.hk
      Check out the MODX tutorial series on my blog at https://www.hkwebdeveloper.com
    • discuss.answer
      It should be in the $_GET (that is, in the URL used to access the current page?
        Studying MODX in the desert - http://sottwell.com
        Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
        Join the Slack Community - http://modx.org
        • 44195
        • 293 Posts
        Cheers sottwell!
        For some reason I thought there may have been a way built into modx. Never mind, get/post it is! wink
          I'm lead developer at Digital Penguin Creative Studio in Hong Kong. https://www.digitalpenguin.hk
          Check out the MODX tutorial series on my blog at https://www.hkwebdeveloper.com
          • 44195
          • 293 Posts
          I still seem to be missing something unfortunately. No doubt very simple but....

          Say I use jquery's ajax function to load a resource with a snippet tag.
          I send a parameter with the ajax call. For example something like:

          var competitionId = 1;
          $.ajax({
              type: "GET",
              url: "[[~5]]",
              data: "compId:"+competitionId,
              success: function(html) {
          	$('#main-wrapper').replaceWith(html);
              }
          });
          


          and say the resource I just called has the following snippet tag:
          [[!artworkList? &competitionId=`THE_PASSED_PARAMETER_NEEDS_TO_GO_HERE`]]
          


          How can I get the parameter in the specified spot?

          I know I could get the value from the query string in javascript with something like:
          var competitionId = location.search.split('compId=')[1]
          


          but not sure how to get the value into the tag!

          Is there another way of going about this that I'm oblivious to?

          Thanks very much once again.
            I'm lead developer at Digital Penguin Creative Studio in Hong Kong. https://www.digitalpenguin.hk
            Check out the MODX tutorial series on my blog at https://www.hkwebdeveloper.com
            • 4172
            • 5,888 Posts
            with fastField

            you could do:

            [[!artworkList? &competitionId=`[[!#get.compId]]`]]




              -------------------------------

              you can buy me a beer, if you like MIGX

              http://webcmsolutions.de/migx.html

              Thanks!
            • The problem with that is that the value is not validated in any way. This could lead to serious problems if malicious visitors insert nasty things in the URL.
                Studying MODX in the desert - http://sottwell.com
                Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                Join the Slack Community - http://modx.org
                • 44195
                • 293 Posts
                Cheers Bruno, for some reason I haven't been able to get fastField to work with $_GET or $_POST so far but I'll have a play around with it later and report back.

                Thanks Sottwell, yeah I had thought about that but I'm at a loss as to how to access a snippet with a parameter through Ajax... if anyone knows of a secure technique to do this I'm all ears smiley

                  I'm lead developer at Digital Penguin Creative Studio in Hong Kong. https://www.digitalpenguin.hk
                  Check out the MODX tutorial series on my blog at https://www.hkwebdeveloper.com
                • Depends on what you're using to send the AJAX.

                  If you're using JQuery, see the "data" and the "type" parameters. For example,
                  $.ajax({
                  type: "POST",
                  url: "myMODXajaxpage.html",
                  data: { name: "John", location: "Boston" }
                  })


                  The myMODXajaxpage resource would have a snippet that gets the $_POST, checks it for valid data, then does whatever with it, returning whatever is applicable to the JQuery making the AJAX request - could be some JSON, or some HTML for display. The snippet will have no concept of how it got the data, from a form or from AJAX, it doesn't care, it just gets the POST wherever it came from.
                    Studying MODX in the desert - http://sottwell.com
                    Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                    Join the Slack Community - http://modx.org
                    • 44195
                    • 293 Posts
                    Thanks guys,
                    A combination of changing to POST and using fastField (what a great component!) appears to have sorted the issue for me!
                      I'm lead developer at Digital Penguin Creative Studio in Hong Kong. https://www.digitalpenguin.hk
                      Check out the MODX tutorial series on my blog at https://www.hkwebdeveloper.com
                    • People can create pages on their machines that will send a POST to your server as if it were from your own page, but with nasty stuff in it. It is always very dangerous to use any incoming data without checking it.
                        Studying MODX in the desert - http://sottwell.com
                        Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                        Join the Slack Community - http://modx.org