Primefaces ab method - javascript

I'm really getting confused by some code. I'm in the process of converting a giant Scala app over to Java. It's a web-app, and uses PrimeFaces for the User interface. However, there are a few things that are throwing me. One is this code snippet:
<td><button id="search:j_idt30" name="search:j_idt30"
class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
onclick="PrimeFaces.ab({formId:'search',source:'search:j_idt30',process:'#all',update:'meetingIndices'});return false;"
type="submit"><span class="ui-button-text">Submit</span></button></td>
I've noticed a call to the ab method. I've been hunting for documentation for a few hours now, and I can't seem to find anything. Does anyone know what the ab method does?
The second question is: Can anyone give any insight into the function of this code? I'm trying to work out which bit of Scala code is called, but as far as I can tell it's just an AJAX request to the index.xhtml page.
Edit
<p:commandButton type="submit" value="Submit" update=":meetingIndices" />
I think that is the tag generating the submit button.

One of "My" uses to ab method is to update some components inside javascript code.
some times remoteCommand doesn't fit in the situation.
So I have to update some components at runtime using jQuery selectors (complicated ones not by name or class).
Let's say I want to update all the p:lightBox links in the page (in order to empty the iFrames)
$('.ui-lightbox').each(function() {
PrimeFaces.ab({source:'',update:$(this).attr('id').replace('_panel','')});
}
Hope it helps.

Related

Wiring up a custom button in BigCommerce Stencil

I'm trying to wrap my head around how to wire up a simple button in BigCommerce Stencil. I've been using this platform for about 24 hours now, so any help you can give is MUCH appreciated!! I haven't used Handlebars.js or jQuery in a few years so I'm pretty rusty.
I'm using the Cornerstone Theme.
What I'm looking to do is:
Click a button
Array of objects sent to my JS function
JS Function adds all the items in the array to the cart.
I feel like this shouldn't be that hard, but where I am getting stuck is.
Getting data that is available in the HTML to be available to my function.
handleButtons() {
$('#add-all-to-cart').on('click', (event) => this.addAllItemsToCart(event));
$('#remove-all-from-cart').on('click', (event) => this.removeAllFromCart(event));
}
//I want to supply {{category.products}} from the HTML
addAllItemsToCart(e) {
console.log('Adding all items to cart');
}
removeAllFromCart(e) {
console.log('Removing all items from cart');
}
And on the HTML side, I have
//This seems to be the way other buttons were made in the Theme
<input id='add-all-to-cart'
data-wait-message="{{lang 'products.adding_to_cart'}}"
class="button button--small"
type="submit"
value="{{lang 'products.add_all_to_cart'}}" />
<input
id="remove-all-from-cart"
data-wait-message="{{lang 'products.adding_to_cart'}}"
class="button button--small"
type="submit"
value="{{lang 'products.remove_all_from_cart'}}" />
The technically correct way of doing this would be to utilize the inject helper. This passes data through to the JS Context within the theme JavaScript files. Assuming you are in a file with access to this context (such as category.js), you could use the following code.
In your HTML: {{inject "categoryProducts" category.products}}
In your JS: console.log(this.context.categoryProducts);

Intercooler.js - ic-target reloads intercooler-code and then is not working anymore

I am using intercooler.js in a django project.
http://intercoolerjs.org
<div id=right_side>
<form ic-post-to="{% url 'update-task-ajax' %}" ic-target="#right_side">
[...]
</form>
</div>
The form itself gets reloaded in the div #right-side after the first (working) use and after that intercooler is not working anymore. How to fix this?
Update:
Looks like i have to use
Intercooler.ready(func(elt))
http://intercoolerjs.org/reference.html
But i'm stuck how to use it properly.
I don't see anything wrong about this, the form should keep submitting and targeting #right_side each time, unless you are replacing it somehow. I don't see why Intercooler.ready() is necessary, given the code. Can you clarify what are trying to accomplish?
I'm availabe on the gitter chat for intercooler to help:
https://gitter.im/intercooler-js/Lobby

webBrowser.document cannot find element

Hello All
Before write this post I read and tried this:
Null Value from GetElementById using C#
How to getelement by class?
C# get element by name
and more.
So
1. I have control on form webBrowser1
2. webBrowser1.Navigation("my url").
3. Check that webBrowser1.ReadyState == WebBrowserReadyState.Complete.
4. After this I tried find element that in i.e. looks like:
<div class="button" style="float: right;">
<input name="uc_InvoiceLines$btnBook" tabindex="5030" class="btnBook btn"
id="uc_InvoiceLines_btnBook" onclick="javascript: return
ValidationOnBooking('You are about to book the invoice. Do you want to
continue','Invoice lines');" type="submit" value="Book">
</div>
5. foreach (HtmlElement ch in webBrowser1.Document.All)
i cannot see this element in .Inner/Outer HTML/TEXT
6. I guest this element has been created by js but don't understand why I can see it in i.e. explore and cannot find in webBrowser1.Document.All?
Anybody can help me to find this "Fantom"?
"So it is on different document. If cross domain iframe and this framed page doesn't handle post message API, you cannot access it. Otherwise read one of the many dupe: stackoverflow.com/questions/1088544/… or stackoverflow.com/questions/9393532/cross-domain-iframe-issu‌​e etc... – A. Wolff "
Thank you very much it's correct answer.

Javascript returns undefined with asp.net master pages

I'm running into a bit of an issue. My JavaScript function returns "undefined" when using master pages. However, when I'm not using master pages, it works fine. Here is my code:
HTML:
<input id="txtPhoneNumberAreaCode" class="TextBox" runat="server" type="text" onkeyup="GoToNextTextBox(this.id, 3, 'cphMainArea_txtPhoneNumberFirstThree')" />
The Javascript:
function GoToNextTextBox(CurrentTextBox, MaxCharLength, NextTextBox) {
alert(CurrentTextBox.value);//pops up "undefined"
if (CurrentTextBox.value.length == MaxCharLength) {
NextTextBox.focus();
NextTextBox.style.backgroundColor = '#FFFFFF';
}
Again, this works fine when not using master pages. So I'm completely confused.
This is because, you are doing it wrong.
In GoToNextTextBox(), you are expecting a DOM element, but you are passing only its id.
DO this:
<input id="txtPhoneNumberAreaCode" class="TextBox" runat="server" type="text"
onkeyup="GoToNextTextBox(this, 3, 'cphMainArea_txtPhoneNumberFirstThree')" />
When using master pages and user controls the rendered ID of your controls change, but there is a way to stop it.
Let's say you have a Textbox
<asp:Textbox id="txtName" runat="server"></asp:Textbox>
on a standard asp page, it's id will be as you expect, txtName
Now you add a master page, called Site.Master. In your rendered html, the controls name is now different.
cntl1_Site_txtName
I might have the syntax of the new name a bit off, but you can view source and find it for yourself.
There is a way to control that though. There is a property on your page, ClientIDMode.
If i remember correctly it has 3 or 4 options. Auto ID is default I believe.
If you set it to static for that page, then you will no longer get the verbose control IDs, they will be as you expect.
This can be a downfall when using things like Repeaters though. You will not have easy access to specific fields if they do not have the verbose ID

"onComplete attribute must be javascript function name" what am i typing wrong?

I'm trying to run a piece of JavaScript code on completion of a song in the <cfmediaplayer> tag but whenever i put "playNext()" into the onComplete attribute it provides me with an error telling me it must be a proper name, but that is the proper name? Anybody know where i might be going wrong?
<script type="text/javascript">
function playNext(){
<cfoutput>
var #ToScript(URL.current, "trackNo")#;
</cfoutput>
trackNo++;
$("#" + trackNo).click();
}
</script>
<div style="margin: 0 auto; width: 500px;">
<cfoutput query="getmusic" maxrows="1">
<cfmediaplayer name="musicPlayer" source="/artists/music/#music_location#" autoplay="yes" height="500" width="500" title="#artist_name# - #music_name#" onComplete="playNext"></cfmediaplayer>
</cfoutput>
</div>
This is my code, however i just noticed (using the Web Developer toolbar) that it is saying playNext is undefined, yet clearly i DO have it defined there as displayed. I'm wondering what I may have done wrong, as far as i'm aware my JavaScript looks OK but i'm a novice when it comes to JS so i've probably made a simple mistake.
use onComplete="playNext" not "playNext()"
Try calling "playNext()" in the onComplete attribute as playNext with no quotations or brackets. If that does not work use playNext(). Let me know if that helps.
I could be wrong but I think it has to do with a CFIDE mapping.
The CFIDE/Scripts folder is needed for a lot of the client side controls ColdFusion creates.
Some CFForm elements like the date picker, multiple file upload, cfajaxproxy, cfmediaplayer, etc require these scripts to be mapped or copied to the site.
Here is a SO question that may help.
Workaround for CFIDE Not Web Accessible for AJAX and Flash Built-Ins
Here is a general google search on the subject.
Try a simple script to mute the player you get any 'Coldfusion is undefined' errors. something like
<script language ="javascript">
ColdFusion.Mediaplayer.setMute('musicPlayer', true);
</script>

Categories

Resources