Sign in to follow this  
louisstephens

How to send multi page ids through Ajax

Recommended Posts

Currently, I have a page set up listing all child pages using a foreach loop and outputting some information (thus far, it is all gravy). However, I ran into a slight problem. I have a "button" on each item being rendered that when clicked needs to send the page id to another page for processing via ajax. I thought I could just save the item id like :

<?php $itemId = $item->id; ?>

And then encoding it below in my javascript:

var itemId = <?php echo json_encode($itemId); ?>;
var data = {
	itemId: itemId,
	};

$.ajax({
	type: "POST",
	url: "/intra/status/",
	data: data,
	success: function(){
		console.log(itemId);
	}
});

However, it is only posting the last page's id rendered by the foreach. Have I just overlooked something simple on this?

Share this post


Link to post
Share on other sites

Hi @louisstephens!

Are you putting all that js inside a foreach? If so the variable names are the same for each list element. Therefore they get overwritten and you always get the last value in your itemId.

Either change the variables to have index as part of their name (itemId1, itemId2) or (preferably) store the id as a data attribute and write a universal js which will get the corresponding data-attr value for each button click dynamically.

If I totally misunderstood you case, please forgive me and provide some more details.

  • Like 2

Share this post


Link to post
Share on other sites

You can use JSON.stringify(data)

Edit:

Sorry ddint read ur post entierly :).

Why dont u for example add data="<?=item->id?>" attribute to each button, then in ur script get the value
 

var itemId = $(this).attr("data");
var data = {
	id: itemId,
};

$.ajax({
	type: "POST",
	url: "/intra/status/",
	data: JSON.stringify(data),
	success: function(){
		console.log(itemId);
	}
});

 

  • Like 2

Share this post


Link to post
Share on other sites

Thanks @Ivan Gretsky and @lokomotivan! I meant to respond yesterday, but I got caught up in the code. I actually did go the data-id="" route which I believe will make things much easier to work with in the future. Now I just need to figure out the ajax get side (updating a div once the initial posting of ids is made) and Ill be in business. I appreciate all the help!

  • Like 2

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By gerald
      In my frontend I would like to implement a small AJAX-solution, but it does´nt work. For example:
      template/js/ajax.js: contains jquery-ajax-snippet with click-function like this: $.post('ajax.inc', function(e) {});
      template/ajax.inc: contains db-query with HTML-output
      template/home.php: contains div-element for the ajax-response, e.g. <div id='result'>...ajax-response...</div>
      It seems, PW does´nt allow database-requests via AJAX (jquery). I know the post from Ryan "How to work with AJAX driven content in ProcessWire". But this solution requires a completely new template-concept. I only need a simple solution for a small ajax-db-request.
      Thanks to all
    • By anderson
      Hi all,
      I'm a new to website building. Learned some CRASH course of js,jquery,php. Then I found CMS. Still learning around forum, youtube....
      Anyway, please help me with some beginer questions:
      1, About template - please correct me if I understand wrong : every page should be (or recommended) built on a template. So if in total I'll have 10 pages, 2 of them have same layout, I'll need 9 templates.  And, what fields a page includes, is not defined in page, but defined in the template that page uses. 
      2,  Where to see what modules I've installed? is it in "Modules - Site"? 
      3, I installed "PageTable Extended", then what?  As in a youtube tutorial, it should appear in Setup tab, but it doesn't.  What's in there: templates,fields,logs,comments. (I installed "Uikit 3 site_blog profile".)
      4, I did a search in Processwire website for the famous "repeater matrix" module, and can not find it, there's a Repeater, as well as a Matrix. Is it not a module?
      5, I watched this youtube tuts: https://www.youtube.com/watch?v=IHqnLQy9R1A
      Anybody familiar with this tuts please help: 
      After he analysed a target webpage layout he wanted to mimic, he created some fields, some template, then based on those he created a page and input some "content" in there, then clicked "view", it's just some text. So, here comes my question, he copied a folder "assets" (subfolders are: css,fonts,js,img) over, then the page have the appearance/layout he wanted to mimic. Where does that assets folder come from?
      Appreciate any help.
    • By Robin S
      Another little admin helper module...
      Template Field Widths
      Adds a "Field widths" field to Edit Template that allows you to quickly set the widths of inputfields in the template.

      Why?
      When setting up a new template or trying out different field layouts I find it a bit slow and tedious to have to open each field individually in a modal just to set the width. This module speeds up the process.
      Installation
      Install the Template Field Widths module.
      Config options
      You can set the default presentation of the "Field widths" field to collapsed or open. You can choose Name or Label as the primary identifier shown for the field. The unchosen alternative will become the title attribute shown on hover. You can choose to show the original field width next to the template context field width.  
      https://github.com/Toutouwai/TemplateFieldWidths
      https://modules.processwire.com/modules/template-field-widths/
    • By louisstephens
      I have done a bit of searching, but I can not seem to find an actual answer. I have a list of services as child pages under "Services". I can output the services just fine, but I cant wrap my head around how to group them "alphabetically" like:
      Services A - Service "A" 1 - Service "A" 2 - Service "A" 3 B - Service "B" 1 - Service "B" 2 - Service "B" 3 C - Service "C" 1 - Service "C" 2 - Service "C" 3 Has anyone achieved this type of functionality before?
    • By Falk
      Hi!
      I have lots of blogposts in my pagetree and I want the pagelabel to include the value of the post’s datefield (only the year).
      Adding date | title in the template settings results in something like…
      1536012000 | my blogpost title
      Is it possible to convert the timestamp to a readable date?