Forums

Hallo,

I have a form that requires guests to fill in. There are a total of 25 clicks he had to make before reaching the final submit button. Can imagine it must be very unfriendly to continue clicking... Is there any way to...

A. Make some of the fields be right next to each other? So I can make the list looks shorter.

B. Instead of showing "choose option", can it be a light grey text? In this way, I can remove some field naming that is taking up space.

Something like the log in (member name & password). http://www.me.com

Thank you =)

Hi Purple Knight,

You can do whatever you like with the code in the Form HTML box and the css files - all that ChronoForms does is give you a working form that looks OK.

Bob

Hallo Bob,

Very nice to hear from you again. I have been working with other website's components (for various parts of my website). Just want to tell you that I am a very happy user with Chronoengine. 😀 The atmosphere here is great! No advertisement... Great support from you, Max & many kind contributors.

You can do whatever you like with the code in the Form HTML box and the css files - all that ChronoForms does is give you a working form that looks OK.

I copied the code out from FORM HTML Box... and tried editing it in Dreamweaver. Doesn't seems right. Hmm... any advice for me? Or should I not use dreamweaver? (I am a very very novice Dreamweaver user).

Hi Purple Knight,

I don't have Dreamweaver (Max does) so I'm not sure what might be the problem. The code is good HTML - though the wrapping tags that make up a page aren't there, and there are no <form> tags either.

I usually end up editing by hand :-(

Bob

Hi Bob, do you have a rough sample code that I can reference? =)

Hi Purple Knight,

Better you post a chunk of the HTML from your form and I'll take a look at it. Just a sample please!

Bob

Thanks a lot, Bob.

My form is super long like 25 questions. I cut it shorter here. =)

<div class="form_item">
  <div class="form_element cf_heading">
    <h1 class="cf_text">1. About</h1>
  </div>
  <div class="clear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 180px;">Location</label>
    <select class="cf_inputbox validate-selection" id="select_2" size="1"  name="select_2">
    <option value="">Choose Option</option>
      <option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
    </select>
    
  </div>
  <div class="clear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 180px;">Name</label>
    <input class="cf_inputbox" maxlength="150" size="30" id="text_3" name="text_3" type="text" />
  
  </div>
  <div class="clear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 180px;">address</label>
    <input class="cf_inputbox" maxlength="150" size="30" id="text_4" name="text_4" type="text" />
  
  </div>
  <div class="clear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 180px;">type</label>
    <select class="cf_inputbox" id="select_5" size="1"  name="select_5">
    <option value="">Choose Option</option>
      <option value="Shared">Shared</option>
<option value="Whole">Whole</option>
    </select>
    
  </div>
  <div class="clear"> </div>
</div>


<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 180px;">size</label>
    <select class="cf_inputbox" id="select_7" size="1"  name="select_7">
    <option value="">Choose Option</option>
      <option value="Less Than 100m2">Less Than 100m2</option>
<option value="100 - 150">100 - 150</option>
<option value="151 - 200">151 - 200</option>

    </select>
    
  </div>
  <div class="clear"> </div>
</div>

  
 <div class="form_item">
  <div class="form_element cf_fileupload">
    <label class="cf_label" style="width: 180px;">photo </label>
    <input class="cf_fileinput" size="20" id="file_30" name="file_30" type="file" />
    
  </div>
  <div class="clear"> </div>
</div>


<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 180px;">I am from</label>
    <select class="cf_inputbox" id="select_24" size="1"  name="select_24">
    <option value="">Choose Option</option>
      <option value="Afghanistan">Afghanistan</option>
<option value="Aland Islands">Aland Islands</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="American Samoa">American Samoa</option>
<option value="Andorra">Andorra</option>
<option value="Angola">Angola</option>
<option value="Anguilla">Anguilla</option>
<option value="Antarctica">Antarctica</option>
<option value="Antigua And Barbuda">Antigua And Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Aruba">Aruba</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>

    </select>
    
  </div>
  <div class="clear"> </div>
</div>

<div class="form_item">
  <div class="form_element cf_button">
    <input value="submit" type="submit" />
  </div>
  <div class="clear"> </div>
</div>

As you can see, field one is below field two, I wonder if I can make it side by side to each other, thus more compact.
(Question: But will it affect the database?)

Thanks a zillion, Bob 😀

As you can see, field one is below field two, I wonder if I can make it side by side to each other, thus more compact.

with the next release this will be "easy"

Regards
Max

Wow, that will be awesome!

Looks like you are working real hard to get the new release out. I appreciate your hard work in creating Chronoform/ Chronoconnectivity & the forum here.

I am targeting to get my site ready to publish within these 2 days. If the new release it out, will it be a smooth transition? Or do I have to recreate the form using the new release? Otherwise can I use any html code as a quick fix 1st? 😀

Hi Purple Knight,

Here's your code inside a very simple table structure - Look for the <table>, <tr> & <td> tags. It clearly needs more work to clean up the css and the order of fields may not be the most logical but it should give you the idea.

Note that the ChronoForms code works n bleock - one for each element:

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 180px;">Name</label>
    <input class="cf_inputbox" maxlength="150" size="30" id="text_3" name="text_3" type="text" />
 
  </div>
  <div class="clear"> </div>
</div>

and keep these blocks together.

Changing the layout has *no* effect on saving the data or sending emails.

Bob

If the new release it out, will it be a smooth transition? Or do I have to recreate the form using the new release?

smooth and easy, its out!

Cheers
Max