Question

EDIT: So this was fixed after obtaining the correct source for my JQuery (the site was trying to play around with it for some reason) and by locating the actual page for the form that is appearing in the iFrame /NewForm.aspx and placing Daniel's code in there. Thank you so much for all of your help Daniel Stölzner, you have been beyond helpful.

What I ended up with:

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<script>
var $j = jQuery.noConflict();
$j(document).ready(function() {
var select = $j("#ctl00_m_g_7bb989f2_7ca9_456f_b0be_ee0996c38db1_ctl00_ctl05_ctl03_ctl00_ctl00_ctl04_ctl00_Lookup")
    select.on("change", function() {
        if (select.find("option:selected").val() == "19") {
            window.location = "http://MYOTHERSITEs/NewForm.aspx"
        }
    })
})
</script>

Original question (incorrect workings removed):- Hi I have a drop down selection in a bubble form for a NewsGator Idea Stream. For business reasons I am not allowed to completely rebuild the site.

This drop down has 15 selections and the form is perfect for 14 of them, the other single selection (PPI) needs additional information. Now I am looking for a simple navigation to another existing site when they choose this single option (i am using workflow solutions to complete this list anyway). I haven't used Jquery before so I'm stuck even trying to trawl through tutorials.

The HTML element can be found below, it is <option value="19">PPI</option> that I am looking to navigate elsewhere on change.

<select name="ctl00$m$g_7bb989f2_7ca9_456f_b0be_ee0996c38db1$ctl00$ctl05$ctl03$ctl00$ctl00$ctl04$ctl00$Lookup" id="ctl00_m_g_7bb989f2_7ca9_456f_b0be_ee0996c38db1_ctl00_ctl05_ctl03_ctl00_ctl00_ctl04_ctl00_Lookup" title="Category">
                <option selected="selected" value="0">(None)</option>
                <option value="6">O1</option>
                <option value="7">O2</option>
                <option value="8">O3</option>
                <option value="9">O4</option>
                <option value="10">O5</option>
                <option value="11">O6</option>
                <option value="12">O7</option>
                <option value="13">O8</option>
                <option value="14">O9</option>
                <option value="15">O10</option>
                <option value="16">O11</option>
                <option value="17">O12</option>
                <option value="18">O13</option>
                <option value="19">PPI</option>
                <option value="20">O15</option>

            </select>
Was it helpful?

Solution

Try this code:

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<script>
var $j = jQuery.noConflict();
$j(document).ready(function() {
    var select = $j("#ctl00_m_g_7bb989f2_7ca9_456f_b0be_ee0996c38db1_ctl00_ctl05_ctl03_ctl00_ctl00_ctl04_ctl00_Lookup")
    select.on("change", function() {
        if (select.find("option:selected").val() == "19") {
            window.location = "http://MYOTHERSITEs/NewForm.aspx"
        }
    })
})
</script>

<select name="ctl00$m$g_7bb989f2_7ca9_456f_b0be_ee0996c38db1$ctl00$ctl05$ctl03$ctl00$ctl00$ctl04$ctl00$Lookup" id="ctl00_m_g_7bb989f2_7ca9_456f_b0be_ee0996c38db1_ctl00_ctl05_ctl03_ctl00_ctl00_ctl04_ctl00_Lookup" title="Category">
    <option selected="selected" value="0">(None)</option>
    <option value="6">O1</option>
    <option value="7">O2</option>
    <option value="8">O3</option>
    <option value="9">O4</option>
    <option value="10">O5</option>
    <option value="11">O6</option>
    <option value="12">O7</option>
    <option value="13">O8</option>
    <option value="14">O9</option>
    <option value="15">O10</option>
    <option value="16">O11</option>
    <option value="17">O12</option>
    <option value="18">O13</option>
    <option value="19">PPI</option>
    <option value="20">O15</option>
</select>
Licensed under: CC-BY-SA with attribution
Not affiliated with sharepoint.stackexchange
scroll top