Welcome to the nuBuilder Forums!

Register and log in to access exclusive forums and content available only to registered users.

Feed hash variable between two iFrames

Questions related to customising nuBuilder Forte with JavaScript or PHP.
Post Reply
nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Feed hash variable between two iFrames

Unread post by nickrth »

I'm hoping someone might be able to help point me in the right direction.

I have two iFrames on a form, both showing a browse form. What I want to happen is when you select and item on the left iFrame, it filter the records in the right iFrame accordingly. In the attached example pic, when you click "Bacon sliced" on the left, I want to to show just three records for that item on the right. I can filter the iFrame on the right with a hash variable no worries, I'm just having trouble setting the variable from the left iFrame and then reading it in the right one.

Thanks in advance!
You do not have the required permissions to view the files attached to this post.
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: Feed hash variable between two iFrames

Unread post by kev1n »

Add a nuSelectBrowse() in the left iFrame's Custom Code.

Replace iframe_id with your right iFrame Id
Replace some_hash_ccookie with the Hash Cookie name

Code: Select all

function nuSelectBrowse(e) {

    var r = $(e.target).attr('data-nu-primary-key'); // retrieve the primary key of the selected cell, assuming that both browse forms share the same primary key.
	if (r !== '') {
		var f = $("#iframe_id")[0].contentWindow; // Get a reference to the iFrame
		f.nuSetProperty('some_hash_ccookie', r); // set a Hash Cookie that can be used in SQL
		f.nuGetBreadcrumb(); // refresh the iFrame
	}

    return false;
}


nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Re: Feed hash variable between two iFrames

Unread post by nickrth »

Thank you so much for your help kev1n. I must be doing something really silly...

I assume that I put that nuSelectBrowse function on the form properties for the iFrame rather than an 'onclick' custom code for the run object containing the iFrame?

Here are all my settings...

Left iFrame
Form ID: 60e670aad718b55
Table name: veventrecipes
Primary key: recipe_id
Browse:

Code: Select all

SELECT veventrecipes.*
FROM veventrecipes
GROUP BY veventrecipes.item_id ASC
ORDER BY veventrecipes.item_name ASC
Custom code:

Code: Select all

function nuSelectBrowse(e) {

    var r = $(e.target).attr('data-nu-primary-key'); // retrieve the primary key of the selected cell, assuming that both browse forms share the same primary key.
   if (r !== '') {
      var f = $("#60e6611fbfda069")[0].contentWindow; // Get a reference to the iFrame
      f.nuSetProperty('filter_item_id', r); // set a Hash Cookie that can be used in SQL
      f.nuGetBreadcrumb(); // refresh the iFrame
   }

    return false;
}
Right iFrame
Form ID: 60e6611fbfda069
Table name: veventrecipes
Primary key: recipe_id
Browse:

Code: Select all

SELECT veventrecipes.*
FROM veventrecipes
WHERE veventrecipes.item_id ='#filter_item_id#'
GROUP BY veventrecipes.dish_id ASC, veventrecipes.item_id ASC
ORDER BY veventrecipes.item_name ASC
When I click on an item in the left iFrame, it doesn't look like it's trying to refresh the iFrame on the right (ie there's no screen redraw happening).

Any ideas what I'm doing wrong?

Thank you so much for your help.
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: Feed hash variable between two iFrames

Unread post by kev1n »

Use the Run Object ID instead of the Form ID (60e6611fbfda069)
nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Re: Feed hash variable between two iFrames

Unread post by nickrth »

So now I have:

Code: Select all

function nuSelectBrowse(e) {

    var r = $(e.target).attr('data-nu-primary-key'); // retrieve the primary key of the selected cell, assuming that both browse forms share the same primary key.
   if (r !== '') {
      var f = $("#item_recipes_sub")[0].contentWindow; // Get a reference to the iFrame
      f.nuSetProperty('filter_item_id', r); // set a Hash Cookie that can be used in SQL
      f.nuGetBreadcrumb(); // refresh the iFrame
   }

    return false;
}
But still no dice... Can't work out what I'm doing wrong.
You do not have the required permissions to view the files attached to this post.
nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Re: Feed hash variable between two iFrames

Unread post by nickrth »

I think I might have an idea as to what the problem is.

Both iFrames refer to the same table (view) and therefore both have the same primary key (recipe_id), but I need to filter the right hand iFrame where the item_id = the hash cookie, not where the primary key = the hash cookie.

So maybe needs a slightly different approach?

I think in need the variable 'r' to return the item_id rather than the PK (recipe_id). But I can't quite work out how to do that.
Last edited by nickrth on Thu Jul 08, 2021 9:23 am, edited 1 time in total.
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: Feed hash variable between two iFrames

Unread post by kev1n »

write:

Code: Select all

      var f = parent.$("#item_recipes_sub")[0].contentWindow; // Get a reference to the iFrame
nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Re: Feed hash variable between two iFrames

Unread post by nickrth »

Woohoo!! It's working. Thanks so much kev1n! :D

While I'm at it, don't suppose you have a solution for highlighting the row that's been selected in the left browse form?
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: Feed hash variable between two iFrames

Unread post by kev1n »

Code: Select all

function nuSelectBrowse(e) {

    var pk = $(e.target).attr('data-nu-primary-key'); // retrieve the primary key of the selected cell, assuming that both browse forms share the same primary key.
    if (pk !== '') {

        // Color the selected row
        var row = $(e.target).attr('data-nu-row');
        $("DIV[id^='nucell']").css("color", 'black'); // reset to black
        $('[data-nu-row="' + row + '"]').css("color", 'red'); // color the selected row

        // Refresh the Recipes iframe
        var f = parent.$("#item_recipes_sub")[0].contentWindow; // Get a reference to the iFrame
        f.nuSetProperty('filter_item_id', pk); // set a Hash Cookie that can be used in SQL
        f.nuGetBreadcrumb(); // refresh the iFrame
    }

    return false;
}
nickrth
Posts: 28
Joined: Sun Aug 23, 2020 3:19 pm
Has thanked: 1 time
Been thanked: 1 time

Re: Feed hash variable between two iFrames

Unread post by nickrth »

kev1n you're an absolute legend!! It works perfectly. Thank you so much.
Post Reply