Online Forms - Form Builder

adam wright asked on November 4, 2014 17:47

Hi i'm using kentico 8.1.9 with aspx templates.

I'm creating a form using the online form modules.

When i use the "Form builder" drag and drop, display the form on my page, view the html source.

I would like to know where the html for the form that gets outputted to the website front is. i've looked for various parts of the html in my solution but can't find it. I really want to edit this, is it compiled??

Thanks

Recent Answers

Brenden Kehren answered on November 4, 2014 19:21

Some of those controls are compiled and some aren't. You'd get a better idea of what those controls are by looking in the Form Controls app and finding the control you are questioning.

Kind of off your question but why ASPX vs. Portal?

0 votesVote for this answer Mark as a Correct answer

adam wright answered on November 4, 2014 21:29

Hi thanks for you reply

i'm on about the surrounding mark up of the form and controls. i like to change it from table to ul layout.

apsx cause i find it gives more control over the markup. this is an old site that was originally built in v5. if i was to build it today i would be going mvc over aspx and portal

0 votesVote for this answer Mark as a Correct answer

Brenden Kehren answered on November 5, 2014 02:49

If you were using Portal mode you could simply check a box to output your < table > tags to < div > tags which would be more helpful. Did you take a look at the form controls within the CMSFormControls directory? In some cases you may be able to modify it there (I'd recommend cloning it and not breaking your upgrade path). Otherwise the majority of it is compiled within the DLLs so you'd need source code to make those modifications. Could also use some jQuery to make modifications, might be a plug-in for that already though.

Interesting concept on being able to control the markup better. Using out of the box page layouts, page templates, doc types, and transformations will allow you that same control. Take a look at some of the responses on this LinkedIn conversation regarding development modes. Only reason I bring this up is think about doing an upgrade or what you're currently doing. How much easier would it be for you and the client if you didn't have to charge them an arm and a leg every time they needed a hotfix applied or an upgrade or some simple feature added?

0 votesVote for this answer Mark as a Correct answer

adam wright answered on November 5, 2014 10:50

i will check out the formcontrols this morning, however i don't want to use

tags, i want my form elements in

. i'm using the form builder as in the documentation here https://docs.kentico.com/display/K81/Designing+forms+using+the+Form+builder

if i use the form builder, don't go to any other tabs on the left i.e use the automatically generated form layout i get mark up like the following:

<div id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_pnlForm" class="FormPanel" onkeypress="javascript:return WebForm_FireDefaultButton(event, &#39;ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_btnOK&#39;)">
        <table class="EditingFormTable"><tr id="TextBoxControl"><td class="FieldLabel"><label id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_TextBoxControl_lb" class="EditingFormLabel" for="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_TextBoxControl_textbox">Text box:</label></td><td class="EditingFormValueCell"><div id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_ncptextboxcontrol" class="EditingFormControlNestedControl editing-form-control-nested-control">
            <input name="ctl00$ctl00$Main$MainContent$widget1$ctl00$viewBiz$TextBoxControl$textbox" type="text" maxlength="500" id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_TextBoxControl_textbox" class="form-control" />
        </div></td></tr><tr id="emailinput"><td class="FieldLabel"><label id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_emailinput_lb" class="EditingFormLabel" for="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_emailinput_txtEmailInput">E-mail:</label></td><td class="EditingFormValueCell"><div id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_ncpemailinput" class="EditingFormControlNestedControl editing-form-control-nested-control">
            <input name="ctl00$ctl00$Main$MainContent$widget1$ctl00$viewBiz$emailinput$txtEmailInput" type="text" maxlength="100" id="ctl00_ctl00_Main_MainContent_widget1_ctl00_viewBiz_emailinput_txtEmailInput" class="form-control" />

        </div></td></tr>

Thats the html i want to change

Thanks

0 votesVote for this answer Mark as a Correct answer

Brenden Kehren answered on November 5, 2014 14:23

That too is compiled and you have very little control over that output. For those items, even if you are using ASPX mode, you still should be able to render the < table > tags as < div > tags. Why is is you need a < ul > layout? If it's a styling issue, the rendered HTML has all the classes you'd need to style it accordingly, unfortunately, there is quite a bit of extra HTML but it works. Also you're form elements are already there. You won't get a

0 votesVote for this answer Mark as a Correct answer

Tanetta Jordan answered on October 14, 2015 16:26

Hello, Where is the box that needs to be checked in order to convert <table> tags to <div> tags? I am using Kentico 8.2. Thank you.

0 votesVote for this answer Mark as a Correct answer