How to add data in popup using primefaces and ajax call - ajax

I am new in JSF, facing a problem while executing GET AJAX request.
I have a icon with a counter (number), once I will do mouse over to the icon it shows a kind of small popup with small list (3 items), kind of same behavior as we have in Social networking sites (Notification icon). Till here All good. Now in my pop up at bottom side, I added a text says "Show more". This should get 3 more items/ notification from the DB via Ajax call and add the response in the popup (without closing the popup), then in total there should be 6 items.
I am not sure how exactly I can achieve this, Please help.
Using <h:outputText value="show more}"> in my xhtml.
In my bean I have a method to getMoreNotification().
Recently I tried with <p:remoteCommand>, but not sure how I can add responce/ data in popup.
Thanks in advance.

Not that difficult
Create a list which is initially populated with 3 items
Create a <p:overlay> with IN that <p:overlay> e.g. a <p:dataList> that shows these list mentioned in 1. Give this component an id, e.g. 'notifications'
When clicking on the 'show more' commandLink, execute the getMoreNotification() via an actionListener and IN that method update the list mentioned in 1. Also make sure you have an update attribute that contains the value of the <p:dataList>.

Related

Oracle APEX takes a value from a function and uses it to open a new page

I have a function that returns a value (e.g.27).
I am put this value to my page item (P2120_SYMPTOM_ID) and i want with this value to open with button another page (P2140).
I am going to button Link builder - target and i am using P2120_SYMPTOM_ID like this:
but unfortunatendly this value doesn't pass to my new page criteria.
How can i use this value?
If you're just navigating to another page (as opposed to opening a modal window) then use action "Submit" on your button and create a branch to the new page. That is how navigation is supposed to be done. The link builder links are generated when the page is rendered and do not pick up session values.
This is a common question, and relates to the fact the link uses values during page render, not what may have happened during interaction with the page
A common solution is presented in the Oracle forums here
https://community.oracle.com/tech/developers/discussion/3725149/pass-client-side-state-to-modal-dialog
Alternatively, there is a free & supported FOEX Redirect plugin that also solves this problem
https://fos.world/ords/f?p=10000:1080

Watir clicking nested elements inside a container

I'm trying to complete a happy path e-commerce payment test but I cant seem to click on the nested element for credit card to be honest I'm not entirely sure which is the clickable element.
Any help to get this working would be appreciated.
When inputting forms, you typically want to interact with input and select elements. In this case, you can see that the visible input field is a radio button - ie <input type="radio">.
You access radio buttons using the radio method and select it by using the set method:
browser.radio(id: 'cc-payment').set
The element you want to click is the input with type radio. You should be able to do something like:
driver.find_element(:css, "input[id='cc-payment'][value='creditCard']").click
I'm curious if clicking on the parent item would resolve.
#browser.input(id: 'cc-payment').parent.click
If the div registers the click and sets the input then this might work. You should be able to manually verify this beahviour by clicking outside of the radial and seeing if it selects.

Using ajax to load drop down lists

I am very new to ajax. Can someone explain to me how this works and what I need to do for my scenario below.
I have a drop down list and a button.
I choose and item from the drop down list ("ex: Car Type")
and press the get types button.
Another drop down list with different types will be populated.
Those are the steps I use. How can I use Ajax instead of post back and refreshing the page please.
Thanks

COLDFUSION CFGRID Datapass with a post

I have a bit of a unique challenge today. I have a client that wants to be able to search for multiple items based on inserts into a cfgrid. Suppose we have the following web form:
A Country selection dropdown
A State Selection dependent AJAX dropdown
A city Selection dependent AJAX dropdown
An ADD Button
----------------------------------------------------
A CFGRID that will populate a row with selections when the user clicks the add button
----------------------------------------------------
And finally, a CLEAR button, and a GO button on the bottom.
The resulting page will then query the database and get some statistics about the cities selected. So, suppose an individual picks USA > Arizona > Scottsdale and USA > Arizona > Flagstaff. The grid below the options will 'save' each selection and reset to their default options, waiting for a user to pick additional options or click on 'GO'.
The resulting page will then generate columns that list some statistics about the communities and highlight the 'best of' between each selected community.
Each time a user selects the ADD button (assuming three criteria are selected) I want the information to be added into a CFGRID that displays the options selected. Then, After the user selects at least one country/city/state option, have all of the data in the CFGRID get passed to another page that does a query from the data selected. In theory, the user could pick as many communities as they want, assuming they are willing to let the database sludge through enough data to get what they want and wait through a 'loading' screen to get it.
I'm having these challenges, in no particular order:
- I have an HTML grid that I must use per client spec (No Java or Flash, must be HTML)
- I have no idea how to get the selected options into the CFGRID. I assume there is some JavaScript I can write that uses some sort of AddRow function to add data into the grid with the add button but cannot seem to find how to it on the interwebs
- After we conquer the above challenge, how do I pass the data from the grid into the results page? I thought about passing one big string or a structure, but I'm not sure how to do that through the URL or posting, nor how to get the data out of the grid. I wonder if I am better off coding some sort of string that gets passed from the options page to the results page with a get method instead of dealing with the stuff in the CFGRID and have the CFGRID serve only as a 'dummy' display container.
- Finally, after the pass is complete, I would need to loop through through the structure and perform a CFQUERY or CFSTOREDPROC on each row of data, then get the statistics I need to display on the results page. I assume this would depend on how I am getting the data from the options selection page to the results page.
THANK YOU ALL!
CFGRID is great to start, but it can be b*tch to customize and extend... Have you tried editable CFGRID with bind? See how far off it is from what you want first. If it turns out to be very far, then you might want to go for a jqGrid and code up some jQuery.
To start, read Using HTML grids and make the cfgrid editable.
http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24-7a01.html#WSc3ff6d0ea77859461172e0811cbec22c24-72e0
Once you got that working, look at these provided JS functions that you can use with CFGRID
http://help.adobe.com/en_US/ColdFusion/9.0/CFMLRef/WS0ef8c004658c1089-6262c847120f1a3b244-8000.html
http://help.adobe.com/en_US/ColdFusion/9.0/CFMLRef/WSd160b5fdf5100e8f-4439fdac128193edfd6-7f5f.html
If you still demand a bit more, you might need to dig into the underlying ExtJS component. At that point I would rather use jqGrid
I found out that the best way to handle this was by using a SerializeJSON call and a Deserialize JSON call back and forth. By using JavaScript notation we are able to pass a complex JavaScript object (array) between one page and another. This has the value add of not having to worry about sessions timing out and making URLs clickable from one solution to the next.

jquery serialize returning incorrect values after previous async page update

Let me try and explain the scenario:
I have a form with multiple items in it. The form is multi-functional so it has multiple submit buttons that are handled on the server correctly.
A single item can be deleted (one submit button per item) and also all items can be saved (a submit button at the bottom of the form).
When an item is deleted a $.post is used and the DIV containing the form is updated with the new response using
$("#containingDIV").html(response)
therefore omitting the deleted item creating a new form.
If I subsequently hit the Save All button and call to
$(form).serialize();
serializes the correct number of items but it includes the item that was deleted and misses the last item in the form.
I can't get my head around why this is happening but I'm no jQuery guru so hoping someone can shed some light on this.
Any help is much appreciated.
Thanks,
Tom.
Thanks everyone for helping. I've just worked out what is going on and it's to do with ASP.NET MVC framework not jQuery. I inspected the response being returned and noticed that all the inputs contained the same item id's as they did prior to the delete. a call to ModelState.Clear() solved the problem for me. Arrrgghh! :D

Resources