HTML5 Data Bindings Support Product Page

Answered

How to create a jump menu using HTML5 Data Bindings?

Asked 26 Mar 2014 21:34:08
1
has this question
26 Mar 2014 21:34:08 Steve Skinner posted:
I know how to create a select menu with HTML5 Data Bindings, but can you show me how to create a jump menu this way? I have a value and a title for each item in the jump menu from a data source, and I would want the value to be used in the URL to pass to the new page. Sort of like this:

newpage.asp?ID={{value}}

How would you go about creating a jump menu using HTML5 Data Bindings to make this work?

Replies

Replied 27 Mar 2014 09:30:39
27 Mar 2014 09:30:39 Teodor Kuduschiev replied:
Hello Steve,
The Jump menu is the same as select menu. What part of creating the jump menu is not clear for you so we can help you?
Replied 27 Mar 2014 14:38:30
27 Mar 2014 14:38:30 Steve Skinner replied:
Yeah, that part I have no problem with (creating the select menu with the list of items. I've even got a working jump menu using a select menu inside a form tag that sends you to another page using the ID from your selection in the menu. It's using the older method (DW recordsets, etc.). The problem is that the same method doesn't work with HTML5 Data Bindings.

Here's the code that works, using DW recordset.
<form action="directory_byclassifications.asp?classID=<%=cStr(Request.Form("classifications"))%>" method="get" name="pickClassForm" id="pickClassForm">
<select name="classID" id="classID">
<option value="">Select Classification...</option>
<
%While (NOT rsGetClassifications.EOF)
%>
<option value="<%=(rsGetClassifications.Fields.Item("classID").Value)%>"><%=(rsGetClassifications.Fields.Item("className").Value)%></option>
<
%  rsGetClassifications.MoveNext()
Wend
If (rsGetClassifications.CursorType > 0) Then
  rsGetClassifications.MoveFirst
Else
  rsGetClassifications.Requery
End If
%>
</select>
<input type="submit" name="button2" id="button2" value="Submit">
</form>


My new code works great for displaying the options, but how do I get it to work like a jump list?
<select name="selectClass" id="selectClass">
          <option value="">View by Class...</option>
            <option value="{{classID}}" data-binding-repeat="{{classList.data}}" data-binding-id="repeat3">{{className}}</option>
      </select>
          <input type="button" name="button2" id="button2" value="Go!">


I did try using a form action like the older style one that works, but I had no luck.
Replied 27 Mar 2014 14:46:09
27 Mar 2014 14:46:09 Teodor Kuduschiev replied:
Well you need to apply the gotourl behavior on button click, which leads you to:

directory_byclassifications.asp?classID={{$FORM.selectClass}} 



Replied 27 Mar 2014 15:06:46
27 Mar 2014 15:06:46 Steve Skinner replied:
Thank you. I've done that but it does not pick up the classID from the select menu. It sends you to this URL: latc.la/directory_byclass.asp?classID=

You can test it yourself. latc.la/directory.asp

Replied 27 Mar 2014 15:10:16
27 Mar 2014 15:10:16 Teodor Kuduschiev replied:
I thought you wanted to use the button that was there. The OnChange Behavior does not work like you are using it now.
In order to create a jump menu that you want to use without a button please check this:
forums.adobe.com/thread/1243980
Replied 27 Mar 2014 15:14:42
27 Mar 2014 15:14:42 Steve Skinner replied:
I misunderstood how you meant to apply the gotourl behavior. I switched it to the button and it works.

Thanks a million for the support. It's what really makes the expense of the extensions well worth it!

Reply to this topic