I want to create a page to allow users to update a mysql table. This table can be changed by client admins so I have to read the table schema and create fields on the fly. I got the basic code for doing that from How to create dynamic JSF form fields and the ajax code from How to add ajax validation to programmatically generated primefaces component.
To create a proof of concept page I use the following code (note, I'm using primefaces):
for (int idx = 1; idx < 3; idx++) {
UIInput input = new InputText();
input.setId("text" + idx);
ValueExpression targetExpression = facesContext.getApplication().getExpressionFactory().createValueExpression(facesContext.getELContext(), "#{viewMakeFields.value}", String.class);
input.setValueExpression("value", targetExpression);
AjaxBehavior ab = new AjaxBehavior();
ab.setAsync(true);
ab.setProcess("text"+idx);
input.addClientBehavior("blur", ab); // "change" doesn't work either
form.getChildren().add(input);
}
Then, in the getter and setter, I'm getting the component ID to identify which field is changed:
public static String getCallingComponentID() {
UIComponent component = UIComponent.getCurrentComponent(FacesContext.getCurrentInstance());
return component.getId();
}
public String getValue() {
String id = getCallingComponentID();
System.out.println("getValue " + id);
return text1;
}
public void setValue(String text1) {
String id = getCallingComponentID();
System.out.println("setValue " + id);
this.text1 = text1;
}
The ajax isn't firing and when I click the submit button I get (and I know mixing partial and full submits isn't good):
INFO: getValue text1
INFO: getValue text2
INFO: getValue text1
INFO: getValue text2
INFO: setValue j_id1
INFO: setValue j_id1
INFO: getValue text1
INFO: getValue text2
I see two possible solutions: get ajax working so that the component calling the setter has the correct id or get the form submit to identify which child is calling the setter. The former is preferable since I want to disable the save button until something has changed but I'm willing to accept the latter at this point. Any help would be much appreciated.
Turns out this code does work. Somewhere in my meandering the error changed and I didn't understand the significance of that. Replacing head with h:head in the xhtml file that I was adding the fields to makes ajax work.
Related
I have a use case where I have created a view object that contains 3 values namely LOC_CODE, LOC_DESC, CITY_DESC. Now in my ADF form I would like to display all 3 values in such a way so that user would have a provision to select LOC_CODE From Popup(LOV) and rest two fileds LOC_DESC & CITY_DESC should be changed accordingly. Currently the popup shows all 3 values but when I select the row and click on OK button it only fills the LOC_CODE in 1 textbox.
Below is the scenario of the same:
Got the solution. Just need to add a textbox or drag and drop near respective field and bind it with required binding object. For e.g. in this case LOC_DESC & CITY_DESC is available in my data control as DefLoc & DefCity that contains SQL to fetch respective description value. Now I need to drag and drop DefLoc & DefCity and binding is automatically done or just check binding in value.
you have to add valuechangelistener to location code. set autosubmit true.
now in backing bean use following code:
public void valuechangelistener(ValueChangeEvent valueChangeEvent) {
valueChangeEvent.getComponent().processUpdates(FacesContext.getCurrentInstance());
BindingContext bctx = BindingContext.getCurrent();
BindingContainer bindings = bctx.getCurrentBindingsEntry();
JUCtrlListBinding list = (JUCtrlListBinding)bindings.get("LOC_CODE");
String selectedValue = (String)list.getAttributeValue();
list.getListIterBinding().setCurrentRowWithKeyValue(selectedValue);
Row currRow = list.getListIterBinding().getCurrentRow();
if (currRow != null) {
bndloc_desc.setValue(currRow.getAttribute("LOC_DESC"));
bndcity_desc.setValue(currRow.getAttribute("CITY_DESC"));
}
}
now set partial trigger to both location desc and city desc with id of LOC_CODE.
After doing this you will get your desired result.
update after implementing it.
In my case JDeveloper 12.2.1.3.0
public void valueChangeListener(ValueChangeEvent valueChangeEvent) {
BindingContext bctx = BindingContext.getCurrent();
BindingContainer bindings = bctx.getCurrentBindingsEntry();
JUCtrlListBinding list = (JUCtrlListBinding) bindings.get("YourBindingforLOV");
String selectedValue = (String) valueChangeEvent.getNewValue();
list.getListIterBinding().setCurrentRowWithKeyValue(selectedValue);
Row currRow = list.getListIterBinding().getCurrentRow();
if (currRow != null) {
String s = (String) currRow.getAttribute("YourAttributeName");
}
}
I'm developing a custom field type that extends from LookupEx. The purpose of the control is to allow the user to select from the drop down, and based upon that selection populated additional fields of type Multilist.
public class CascadingDroplink : LookupEx
{
private const string sourceFieldName = "CascadingDroplink";
protected override void DoRender(System.Web.UI.HtmlTextWriter output)
{
StringBuilder sb = new StringBuilder();
sb.AppendLine("<script type=\"text / javascript\">");
sb.AppendLine(" var $j = jQuery.noConflict(); ");
sb.AppendLine(string.Format(" $j(\"#{0}\").change(function(event) {{ ", this.ID));
sb.AppendLine(string.Format("scForm.invoke('contenteditor:save', event);"));
sb.AppendLine(string.Format(" }});"));
sb.AppendLine("</script>");
output.Write(sb.ToString());
Fromt the embeded javascript, you can see I have found a way to perform a callback by simulating the click even of the Save button:
scForm.invoke('contenteditor:save', event);
And while this works, the content editor is refreshed, and the Multilist fields are updated with custom datasources, saving isn't ideal because there could be validation present.
How can the contenteditor be refreshed, as if the area was within a callback panel, without calling save?
Thanks!
I want to programmatically access the Fields collection in the ObjectDataSource object of my Telerik report.
I did notice in the design portion of the Telerik report you can access the fields collection
in the Value by using the Edit Expression window.
Example:
= Fields.MyFieldName
How would I accomplish this task using C# code in the report code behind file?
I had the same problem. This is how I solved it, although I believe there should be an easier way.
First I created a method for the details section itemdatabinding:
private void detail_ItemDataBinding(object sender, EventArgs e)
{
Telerik.Reporting.Processing.DetailSection section = (sender as Telerik.Reporting.Processing.DetailSection);
object id = section.DataObject["Data Field You want to access"];
Variable Name = id.ToString();
}
You can now use that variable anywhere in your codebehind.
Note: The Data Field must appear in your detail section. In my case I did not need it to show, so I just made 'Visible=false'.
This worked for me.
Bind Data to your own data to your variables
string ItemCode = "a";
string ItemDesc = "aa"
Then bind it to the data source
var Output = new
{
ItemCode = a.ItemCode,
ItemDesc = a.ItemDesc,
};
this.DataSource = Output;
All these are in code behind. Then move to design portion and modify your text-box as shown below.
= Fields.ItemCode
= Fields.ItemDesc
I am using JQGrid with the Trirand.Web.Mvc class, and trying to figure out how to do custom paging.
I have seen the paging demos here
The problem with these demos is that they bind directly to a linq context object and lets MVC take care of the paging.
// This method is called when the grid requests data. You can choose any method to call
// by setting the JQGrid.DataUrl property
public JsonResult PerformanceLinq_DataRequested()
{
// Get both the grid Model and the data Model
// The data model in our case is an autogenerated linq2sql database based on Northwind.
var gridModel = new OrdersJqGridModel();
var northWindModel = new NorthwindDataContext();
// return the result of the DataBind method, passing the datasource as a parameter
// jqGrid for ASP.NET MVC automatically takes care of paging, sorting, filtering/searching, etc
return gridModel.OrdersGrid.DataBind(northWindModel.OrdersLarges);
}
The data set I want to bind to is quite complex and I am returning it from a stored procedure, which does the paging for me.
So all I have to give JQGrid is the correct size of rows for a specific page of the entire resultset. I can also return the total row count.
So I have my results in a List myListOfObjects.
I can pass this into the DataBind using myListOfObjects.AsQueryable()
The problem is, JQGrid thinks there is only {page size} rows, so does not display any of the paging options.
Is it possible to pass in the total row count?
Other grids, like Teleriks MVC grid allows you to pass in the Total row count, and it displays the paging correctly
Ok, so I've managed to solve this myself. There may be other ways to do it, if so I'd love to hear them!
The JQGrid.DataBind produces an JsonResult object, whose Data value is set to Trirands own object Trirand.Web.Mvc.JsonResponse
It's an internal class to their Trirand.Web.Mvc, so i had to copy its structure which I could see using Visual Studio debugging.
It has:
page - the current page number
records - the total record count
rows - of type Trirand.Web.Mvc.JsonRow (which I need to replicate too)
total - the total number of pages needed
JsonRow looks like:
cell - a string array of your columns
id - your row ID
So my code looked like this:
var jsonList = new List<JSONRow>();
myData.ForEach(x => jsonList.Add(new JSONRow(x)));
var jsonResult = Json (new
{
page = page,
rows = jsonList.ToArray(),
records = totalRows,
total = Math.Round((double)totalRows / rows, MidpointRounding.AwayFromZero)
}, JsonRequestBehavior.AllowGet);
return jsonResult;
My JsonRow looks like this:
public class JSONRow
{
public string[] cell { get; set; }
public string id { get; set; }
public JSONRow(MyObjectType myObject)
{
id = myObject.id;
cell = new string[3];
cell[0] = myObject.Col1;
cell[1] = myObject.Col2?? "";
cell[2] = myObject.Col3?? "";
}
}
I'm using WatIn to create an automated test for a Web App that uses Telerik controls: my first challenge is to drive a Telerik date control - a RadDatePicker.
Simply entering the text in the likeliest input field doesn't work: the value is reset to blank as the form is posted. So I imagine I need a more complex set of automated interactions -- for example, I found this thread on the Telerik site discussing how to automated a selection from a Telerik combo box.
Can anyone supply the magic combination of interactions I need?
(I'm sure that the answer would help anyone using any automated test tool, hence I've also flagged this question with a couple of other test frameworks too :-))
I'm using Selenium RC and had a similar problem few days ago. It took me ages to find the right way of doing it so I thought I will share the solution that worked for me:
(NOTE: I couldn't use $find)
The javascript to set the date on the RadDatePicker is:
var appBrowser = this.browserbot.getCurrentWindow();
var datepicker = appBrowser.yourDatePickerId; //note: no quotes
var selectDate=new Date();
selectDate.setFullYear(yourYear,yourMonth,yourDay);
datepicker.SetDate(selectDate);
datepicker.DateInput.SetDate(selectDate);
and then use selenium GetEval in your test to call javascript code to set the date:
selenium.GetEval("javascript here");
You should definitely wrap it around some parametrised helper class that will generate the javascript code for you each time you want to set the date in the test by passing id of the control and date.
I finally have a solution that works. The key is to use javascript to call the client-side API for the telerik control. The same technique is required for all complex Telerik controls, e.g. RadInput.
I used the technique recommended on the WatiN website for writing your own control http://watinandmore.blogspot.com/2009/12/wrapping-complex-logic-in-control.html to come up with this:
public class TelerikDatePicker : Control<TextField>
{
public DateTime? Value
{
get
{
var jScript = string.Format(#"$find(""{0}"").get_selectedDate();", Element.Id);
var selectedDateStr = Eval(jScript);
return TranslateJavascriptDateStringIntoDateTime(selectedDateStr);
}
set
{
var jScript = string.Format(#"$find(""{0}"").set_selectedDate(new Date(""{1:MMMM dd,yyyy}""));", Element.Id, value);
Eval(jScript);
}
}
public void SetValue(DateTime? value)
{
if (value.HasValue)
Value = value.Value;
else
Clear();
}
public void Clear()
{
var jScript = string.Format(#"$find(""{0}"").clear();", Element.Id);
Eval(jScript);
}
private string Eval(string script)
{
return Element.DomContainer.Eval(script);
}
public bool IsEnabled()
{
var jScript = string.Format(#"$find(""{0}"").get_enabled();", Element.Id);
return Eval(jScript) == "true";
}
private DateTime? TranslateJavascriptDateStringIntoDateTime(string jsDateStr /*E.g. Mon Mar 12 00:00:00 UTC+0100 2012*/)
{
if (String.IsNullOrEmpty(jsDateStr) || jsDateStr == "null") return null;
var abbreviatedMonth = jsDateStr.Substring(4, 3);
var dayOfTheMonth = jsDateStr.Substring(8, 2).TrimEnd(' ');
var year = jsDateStr.Substring(jsDateStr.Length-4, 4);
const string format = "d MMM yyyy";
var dateStr = dayOfTheMonth + " " + abbreviatedMonth + " " + year;
return DateTime.ParseExact(dateStr, format, CultureInfo.InvariantCulture);
}
}
I had the same issue with a RadDatePicker that would post back empty after typing in values.
I managed to automate typing in the date into the input field with these steps:
Select the dateInput text box associated with the control.
Do a dateInput.MouseClick() on it
Type the date into the field Manager.Desktop.KeyBoard.TypeText("1/1/1990")
Do a .MouseClick() on any other element on the page, e.g. some div
I found that #4 was needed to fire the events to make the control blur therefore "saving" its value.
Then you can submit and the value should go along with it.
Solved that problem for SeleniumIDE - you have to use "fireEvent" method with value "blur" for "ControlID" after you've set value using "sendKeys" or "type" methods. Strange that this problem does not occur when automating with WebDriver.