I get a list of column values from a view that I feed into a comboBox to select a value and store it in a field. From a look and feel I would like to feed this list to dijit.Menu I have not done much with dojo and have not been able to find an example that could point me in the right direction.
You can use the drop-down button from ExtLib which would provide a similar look and feel:
<xe:dropDownButton
id="dropDownButton1">
<xe:this.treeNodes>
<xe:basicContainerNode>
<xe:this.label><![CDATA[#{empty viewScope.myValue?"Select a value...":viewScope.myValue}]]></xe:this.label>
<xe:this.children>
<xe:basicLeafNode
label="Label 1"
submitValue="value1">
</xe:basicLeafNode>
<xe:basicLeafNode
label="Label 2"
submitValue="value2">
</xe:basicLeafNode>
</xe:this.children>
</xe:basicContainerNode>
</xe:this.treeNodes>
<xp:eventHandler
event="onItemClick"
submit="true"
refreshMode="partial"
refreshId="dropDownButton1">
<xe:this.action><![CDATA[#{javascript:var value=context.getSubmittedValue();
if(value!=null && value!="") viewScope.myValue=value;}]]></xe:this.action>
</xp:eventHandler>
</xe:dropDownButton>
Here, viewScope.myValue is the secret data binding. You have to handle the data validation separately (maybe via an inputHidden component). Also you might use repeatTreeNode instead of beanLeafNode, so you would have calculated list of options.
Related
I want to make switchFacet for practice, but in vain. Actually dont know where to start. Can this be written only in java? Here is my code. I try to pass variable through sessionScope. Button updates value, but facet doesnt. Facet changes value if I click URL and then ENTER.
This is my Xpage:
<xc:FacetContainerCC viewPanelTest="#{sessionScope.VarTest}">
<xp:this.facets>
<xp:div xp:key="SecondCC"><xc:SecondCC></xc:SecondCC></xp:div>
<xp:div xp:key="FirstCC"><xc:FirstCC></xc:FirstCC></xp:div>
</xp:this.facets>
<xp:button value="#{javascript:sessionScope.VarTest}" id="button1">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:if (sessionScope.get("VarTest") == "First")
sessionScope.put("VarTest", "Second"); else sessionScope.put("VarTest","First");}]]>
</xp:this.action>
</xp:eventHandler>
And my facet:
<xp:callback id="callback1">
<xp:this.facetName><![CDATA[#{javascript:
var viewPanelTest = sessionScope.get("VarTest");
if (viewPanelTest == "First") return "FirstCC";
else return "SecondCC";}]]>
</xp:this.facetName>
I noticed there is a difference between updating page by button and re-entering URL. Button makes POST request, re-entering URL makes GET request.
FirstCC and SecondCC are custom components dropped on facet.
And... sessionScope variables with same name co-exists on client and server, right?
Facets are computed on page load. As long as your page is loaded, the facet won't get recomputed. Thus your facetName will not get updated. Works as designed. The switchFacet loads all facet names but renders out only the selected one.
When you hit enter at the URL you get a new instance of that page (with a new viewScope), while the button does a page refresh (same viewScope) and thus no recomputation of facetName.
The switchFacet was created to accommodate exactly your use case since the existing facet functionality can't cover it.
I am wanting to customise the edit form in jqGrid so that instead of using the table structured layout provided I would like to use my own custom css structured layout for the form elements. How should I go about modifying the edit form to allow me to use my own custom look?
You can definitely achieve this by jquery ui dialog. However I can not put full code for you but helps you in the steps you have to do.
1 design your custom form whatever CSS and style you want to apply.
Suppose this is youe custome form
<div id="dialog-div">
<input type="text">
</div>
2 on jquery dialog open the dialog on your jqgrid editbutton click
$("#edit").click(function(){
var rowdata = $("#coolGrid").jqGrid('getGridParam','selrow');
if(rowdata){
$("#dialog-div").dialog('open');
var data = $("#coolGrid").jqGrid('getRowData',rowdata);
alert(data);
}
});
by default it will close as-
$("#dialog-div").dialog({
autoOpen: false,
});
Now as you get data in variable you can put in your edit form and of jquery dialog button save it according to your logic.
Hope this helps you.
I would recommend you first of all to read (or at least look thorough) the code of form editing module which implement the part which you want to replace. You will see that it consist from more as 2000 lines of code. If you write "I would like to ..." you should understand the amount of work for implementing what you ask. If you are able to understand the code and if you are able to write your modification of the code even using libraries like jQuery UI then you can decide whether it's worth to invest your time to do the work. The main advantage of using existing solutions is saving of the time. What you get in the way is not perfect, but using existing products you could create your own solutions quickly and with acceptable quality. The way to study existing products which you can use for free seems me more effective as large investments in reinventing the wheel.
http://guriddo.net/?kbe_knowledgebase=using-templates-in-form-editing
Using templates in form editing
As of version 4.8 we support templates in the form editing. This allow to customize the edit form in a way the developer want. To use a template it is needed to set the parameter template in the edit add/or add options of navigator. This can be done in navigator or in the editing method editGridRow :
$("#grid").jqGrid("navGrid",
{add:true, edit:true,...},
{template: "template string for edit",...}
{template: "template string for add",...},
...
);
and in editGridRow method:
$("#grid").jqGrid("editGridRow",
rowid,
{template: "template string",...}
);
To place the CustomerID field in the template the following code string should be inserted in the template string
{CustomerID}
With other words this is the name from colModel put in { }
The usual problem with table layouts is when you have columns with different widths, especially with those very wide.
I solved my problem adding the attr colspan to wide columns in the beforeShowForm event.
for example
"beforeShowForm":function() {
$('#tr_fieldnameasinColModel > td.DataTD').attr('colspan',5);
}
It's not fancy but it worked for me. Perhaps there is a more elegant way to do the same.
I could arrange the fields in several columns without having to make the form extrawide.
When user click on edit button the page navigate to another page, based on Id get the details of a row and you can display the values..
Previous answer of Creating a link in JQGrid solves your problem.
Pictures speak better than words...
I want to return the street address but for that I have to pass city and state. I've tried many ways and I could not, because I'm not understanding but I think when I make an ajax autocomplete and set the values of city and state, the values don't are going through to the managedbeans. They pass only when I advance in wizard, perhaps because the autocomplete process and just update itself (even me trying to update the other fields through other ajax requests within autocomplete tags).
The following code:
<p:autoComplete global="true" id="autoCompleteEnderecoCidadesLogradouro"
completeMethod="#{cidadeMB.autoCompletaEnderecoPojo}"
value="#{cidadeMB.enderecoTemp}" var="e" itemValue="#{e}"
itemLabel="#{cidadeMB.cidade.endereco.logradouro}" converter="enderecoConverter"
forceSelection="true" minQueryLength="5" maxResults="15" queryDelay="800"
styleClass="textoLogradouro">
<p:ajax process=":tabViewSistema:tabViewCadastro:formAddCidades:testeCidadeInput"
update=":tabViewSistema:tabViewCadastro:formAddCidades:testeCidadeInput"/>
<p:column>#{e.logradouro}</p:column>
<p:column>#{e.cep}</p:column>
<p:column>#{e.uf}</p:column>
<p:ajax event="itemSelect" listener="#{cidadeMB.handleSelecaoDeEndereco}"
update=":tabViewSistema:tabViewCadastro:formAddCidades:panelAddCidadesT3"/>
</p:autoComplete>
Can anyone give me a hint how to do it?
Other people had the same problem, and PrimeFaces addressed this:
Issue 3593: Add process option to autocomplete
Summary: Add process option to autocomplete
Labels: TargetVersion-3.2
[...]
We'll add process option which you can use to add other component
on page to decide what to process during search request.
[...]
Done, you now can do process="otherComponents" while entering data.
So you can now add attribute process="otherComponent1 otherComponent2" to the <p:autocomplete>. JSF should then set the values from those componentes in the backing bean on every autocomplete callback, just like during a regular submit, and your autocomplete callback can refer to the values.
I am trying to select a link/button inside of a form, that is in a div. the way it was made is that there are two links/buttons of the same id, name etc. however they are in different forms, so the code i wanted to use is:
_myTest.Form(Find.ById("PermissionsForm")).Child(Find.ByClass("saveBtn")).Child(Find.ByText("SAVE"));
any help would be appreciated
I think this is what you need:
var button = _myTest.Form("PermissionsForm").Button(Find.ByClass("saveBtn"));
This will lookup the button having the class 'saveBtn' inside the form 'permissionsform' in your browser instance _myTest.
Have a look at this page to decide if you need to have .Button(..) or .Link(...) based on the html tag that is used in your html.
How about building a regex for the element?
Regex could something like this
Regex elementRe = new Regex("id=LnkOk href="http://stackoverflow.com");
Then you can use your code to Click this link. The Click method can be extended to accept Regex if it is not already doing that.
Let me know how this goes or if you need more info.
Cheers,
DM
I have this input of type "Submit" that Watir cannot see. I can identify it by ID, but it doesn't turn up in browser.text_fields, or by any other idenfication method. The ID is dynamically generated so I cannot use it for testing. Any ideas on how to make this readable? I'm willing to change the WATiR source code if necessary.
<INPUT id=t8CPm value=Submit type=submit>
I have obviously tried text_field(:value, 'Submit') and text_field(:type, 'Submit'), and I get an "Unable to locate element" error.
Did you try treating it as a button element? Inputs of type submit are generally considered to be a button because the browser generally renders them that way.
try
browser.button(:value, 'Submit').flash
and see if it works for you
I changed INPUT_TYPES to ["text", "password", "textarea", "submit"] in the TextField class of input_elements.rb and there it was.
I should also probably edit the collections to read the type too.
Edit: I am an idiot and I didn't need to do this, but I'm leaving it here in case anyone else needs to identify a real dynamic-id custom-type text field, not a fake dynamic-id custom-type text field otherwise known in my particular case as a "button".