Dynamic Radiobutton Group By key in Web dynpro Java

[Former Member]

Hi I am making an online exam application in that there is a question and four options. But when i am trying to create radiobuttons i could not bind options with radiobuttons. I tried using all three types of radiobuttons i.e single radiobuttons, group by index and group by key but the problem is the same

for(int j=0;j<4;j++)

{

IWDRadioButtonGroupByIndex radioButtonGroupByIndex = (IWDRadioButtonGroupByIndex)view.createElement (IWDRadioButtonGroupByIndex.class,"RadioButtonGroupByIndex1"ij);

radioButtonGroupByIndex.bindTexts("Questions.option"+wdContext.nodeQuestions().getQuestionsElementAt(i).getOption());

radioButtonGroupByIndex.setColCount(1);

transparentContainer.addChild(radioButtonGroupByIndex);

}

The problem is I get the same set of options in all the questions.

I am confused at what code should i write in bindTexts in groupby index and bindSelectedKey in groupby key

Please help

Swapnil Indulkar

[Amey-Mogare · Accepted solution]

Hi Swapnil,

Try this code in your wdDoModifyView.

It is working fine with me.

    if(firstTime){
		IWDTransparentContainer rootContainer = (IWDTransparentContainer) view.getElement("RootUIElementContainer");
		IWDRadioButtonGroupByIndex radioButtonGroupByIndex = (IWDRadioButtonGroupByIndex)view.createElement (IWDRadioButtonGroupByIndex.class,"rbgi_1");
		rootContainer.addChild(radioButtonGroupByIndex);
		radioButtonGroupByIndex.bindTexts(wdContext.nodeCtx_vn_options().getNodeInfo().getAttribute("option"));
    }

Note that, I have created a context node with name Ctx_vn_options with one attribute named option.

And I have initialized this node with 3 elements in wdDoInit()

    IPrivateTestPdfView.ICtx_vn_optionsElement optionEle = null;
    optionEle = wdContext.createCtx_vn_optionsElement();
    optionEle.setOption("1");
    wdContext.nodeCtx_vn_options().addElement(optionEle);
    
	optionEle = wdContext.createCtx_vn_optionsElement();
	optionEle.setOption("2");
	wdContext.nodeCtx_vn_options().addElement(optionEle);
	
	optionEle = wdContext.createCtx_vn_optionsElement();
	optionEle.setOption("3");
	wdContext.nodeCtx_vn_options().addElement(optionEle);

Hope it helps.

With regards,

Amey Mogare

[Former Member]

First you should not mix-up RadioButtonGroupByIndex and *ByKey. Your code uses *ByIndex.

Say you have some data model (might be stored in database) that provides a number of questions,

and each question offers a certain number of options.

Then you can implement your application like this:

Context
+ Questions (node, cardinality=0:n, selection=0:1, supplyFunction=supplyQuestions)
   + id (string)
   + text (string)
   + Options (node, cardinality=0:n, selection=0:1, supplyFunction=supplyOptions)
      + text (string)

Now you have to decide if you want to display only one question at a time or maybe all.

Say you only want to offer a single question at a time.

Make the "Options" node a singleton child node of "Questions".

Implement the supply functions:

void supplyQuestions(IQuestionsNode node, IWDNodeElement parentElement)
{
  /* read questions from data model and fill given node */
  for ( result: query(data model, all questions) )
  {
    IQuestionsElement question = node.createAndAddQuestionsElement();
    question.setId(result.questionId);
    question.setText(result.questionText);
  }
}

void supplyOptions(IOptionsElement node, IWDNodeElement parentElement)
{
  IQuestionsElement question = (IQuestionsElement) parentElement;
  /* read options from data model for question corresponding to parent node element */
  for ( result: query(data model, options for question with ID=question.getId()) )
  {
    IOptionsElement option = node.createAndAddOptionsElement();
    option.setText(result.optionText);
  }
}

Now you can create your UI completely in the IDE, e.g. a TextView for displaying the question text and a RadioButtonGroupByIndex to display the options for the current question. Bind the TextView.text property to attribute Questions/@text and bind the RadioButtonGroupByIndex.texts property to attribute Questions/Options/@text.

To display a certain question just set the lead selection of the Questions node to the corresponding index. Maybe you want to provide a button for navigating to the next question. Assign an action "ToNextQuestion" to the button and just write

wdContext.nodeQuestions().moveNext();

Armin

[Amey-Mogare]

That's absolutely genius, Armin !

This didn't strike my mind. Wonderful solution.

However i have managed to achieve it in a bit complex way as compared to yours.

(I have hard-coded it for 3 questions with 4 options each.)

//Code in wdDoInit() of View
	g_questionNode = wdThis.wdGetAPI().getContext().getRootNode().getChildNode("Questions", IWDNode.LEAD_SELECTION);
	g_optionsNode = wdThis.wdGetAPI().getContext().getRootNode().getChildNode("Options", IWDNode.LEAD_SELECTION);
	for(int i=0; i<3; i++){
		
		g_questionNode.getNodeInfo().addAttribute("Question"+i,"com.sap.dictionary.string");
		g_questionNode.getCurrentElement().setAttributeValue("Question"+i, "This is QuestionText["+ i+"] ?");
		
		g_optionsNode.getNodeInfo().addAttribute("Option"+i,"com.sap.dictionary.string");
		IModifiableSimpleValueSet optionsSet = g_optionsNode.getNodeInfo().getAttribute("Option"+i).getModifiableSimpleType().getSVServices().getModifiableSimpleValueSet();
		for(int j=0; j<4; j++){
			optionsSet.put("Q"+i+"O"+j, "This is optionText[" +j +"] for QuestionText[" + i + "]");
		}		
	}


//Code in wdDoModifyView()
    if(firstTime){

		IWDTransparentContainer rootContainer = (IWDTransparentContainer) view.getElement("RootUIElementContainer");
		
		for(int i=0; i<3; i++){

			IWDLabel label = (IWDLabel) view.createElement(IWDLabel.class, "label_"+i);
			rootContainer.addChild(label);
			label.bindText(g_questionNode.getNodeInfo().getAttribute("Question"+i));
			label.setDesign(WDLabelDesign.EMPHASIZED);
			IWDGridData labelGridData = (IWDGridData) label.createLayoutData(IWDGridData.class);
			labelGridData.setCellBackgroundDesign(WDCellBackgroundDesign.PLAIN);
			labelGridData.setHAlign(WDCellHAlign.CENTER);
		
			IWDRadioButtonGroupByKey rbgbk = (IWDRadioButtonGroupByKey)view.createElement (IWDRadioButtonGroupByKey.class,"rbgbk_"+i);
			rootContainer.addChild(rbgbk);
			label.setLabelFor("rbgbk_"+i);
			rbgbk.bindSelectedKey(g_optionsNode.getNodeInfo().getAttribute("Option"+i));
			IWDGridData rbgbkGridData = (IWDGridData) rbgbk.createLayoutData(IWDGridData.class);
			rbgbkGridData.setCellBackgroundDesign(WDCellBackgroundDesign.PLAIN);
			rbgbkGridData.setHAlign(WDCellHAlign.CENTER);
		}
    }

This works fine too.

With regards,

Amey Mogare

[Former Member]

My sketched solution just uses some of the main concepts of Web Dynpro like lead-selection and supply functions for implementing master-detail scenarios.

Armin

[Former Member]

Hi

Thanks alot for the support

But i have got problem in init initialzation of node

I have the set of questions and there respective options in the database i need to fetch those questions and there corresponding options from the database.

There are four options for each questions

The solution which you provided i tried in a sample program it worked for one option. But i need to fetch four options at the same time.

I tried using your solution in my application but an getting last option of all the questions from the database in one question. In the second question also the same set of last option

Please guide me

Swapnil

[Amey-Mogare]

Hi Swapnil,

I understood what you mean to say.

In this type of scenario where you are receiving questions and answers from backed, you can use Dynamic modifiable simpletypes to attach to RadioButtonGroupByKey.

So lets say you have 3 questions and 4 options per question. Then you need to create following things dynamically:-

First:

1. 3 context attributes --> for optionsText and bind a ISimpleTypeModifiable containing 4 options-texts to each of them.

2. 3 context attributes --> for questionText

Next:

3. 3 text View UI elements --> corresponding to 3 context attributes questionText0, questionText1 and questionText2

4. 3 RadioButtonGrpByKey --> corresponding to 3 context attributes optionText0, optionText1 and optionText2.

Are you getting what I mean to say?

I am trying this way in my sample code and I am sure it will work.

With regards,

Amey Mogare