s
Contact Login Register
h M

Dynamic Forms–Hide/Show rows without a postback

Author: Chad Nash/Wednesday, May 30, 2012/Categories: In The Flow

Rate this article:
3.0

Wouldn’t you prefer to hide or show fields on your Dynamic Form instances without using Question Events? Postbacks can become time consuming if you have a large form. This example is just me sharing a technique that I use within Dynamic Forms to avoid Question Event Postbacks.

This example uses JavaScript to achieve the conditional hide or show Dynamic Form field.

Here’s my form:

1

 

Preparing the JavaScript

I want to hide the two Multi-lined text boxes until a selection is made from the Radio buttons. So I want to initially hide the two Multi-lined text boxes on page load. To do so I can use JavaScript under the Module Configuration –> Advanced Coding Options (AJAX, jQuery, JavaScript, Initial SQL DataBind) –> Custom JavaScript File –> Initial JavaScript. However what do I put there????

We will need to find the Dynamic Forms rowID’s for the Label and Question that we wish to hide. You can look into the Source code to obtain, or like myself, use the FireFox plugin(FireBug).

In this example, my RowID’s are:

  • dnn_ctr2537_DynamicForms_Row_95e63704-01d5-4b49-8fd5-169404b9dcb0
  • dnn_ctr2537_DynamicForms_Row_5b493000-04e2-4ed5-b141-1f6631af5857

 

So I need to prepare some JavaScript to place into the Initial JavaScript section that I mentioned above:

 

var err;

try{ document.getElementById('dnn_ctr2537_DynamicForms_Row_95e63704-01d5-4b49-8fd5-169404b9dcb0').style.display= 'none'; } catch(err){}

try{ document.getElementById('dnn_ctr2537_DynamicForms_Row_5b493000-04e2-4ed5-b141-1f6631af5857').style.display= 'none'; } catch(err){}

 

Now upon page load my two Multi-lined text boxes will be hidden.

 

I must prepare the JavaScript to conditionally show / hide the correct Multi-lined text box based on the Radio Button selection.

 

Preparing the Hide/Show JavaScript

The JavaScript below contains the logic to hide/show the appropriate Multi-lined text box. 

 

if(funcRadioCalc($(DForDR_FieldID)) == 'DynamicForms'){document.getElementById('dnn_ctr2537_DynamicForms_Row_95e63704-01d5-4b49-8fd5-169404b9dcb0').style.display= '';document.getElementById('dnn_ctr2537_DynamicForms_Row_5b493000-04e2-4ed5-b141-1f6631af5857').style.display= 'none';}else if(funcRadioCalc($(DForDR_FieldID)) == 'DynamicRegistration'){document.getElementById('dnn_ctr2537_DynamicForms_Row_95e63704-01d5-4b49-8fd5-169404b9dcb0').style.display= 'none';document.getElementById('dnn_ctr2537_DynamicForms_Row_5b493000-04e2-4ed5-b141-1f6631af5857').style.display= '';}else{document.getElementById('dnn_ctr2537_DynamicForms_Row_95e63704-01d5-4b49-8fd5-169404b9dcb0').style.display= 'none';document.getElementById('dnn_ctr2537_DynamicForms_Row_5b493000-04e2-4ed5-b141-1f6631af5857').style.display= 'none';}

 

Below is an image of the configuration settings for the Radio Button control:

3

 

Now you have achieved hiding/showing specific Dynamic Form questions  conditionally without a postback occurring.

Number of views (275404)/Comments (-)

Tags:
blog comments powered by Disqus

Enter your email below AND grab your spot in our big giveaway!

The winner will receive the entire Data Springs Collection 7.0 - Designed to get your website up and running like a DNN superhero (spandex not included).

  
Subscribe
replica watches
konulu porno
deneme bonusu maltcasino bahis siteleri
sex video free download in mobile hot sexy naked indian girls download free xxx video
atasehir eskort antalya escort bahcelievler escort alanya escort atasehir escort
porno izle
gaziantep escort gaziantep escort
escort pendik
buca escort
izmir escort bayan
vdcasino casino metropol casinomaxi