0

I`m using script similar to UI Selectable which i found on google.

If I have 8 buttons and the first one is always auto selected when you open the page, then how could I additionally select another button via the url, either by query string or id anchor?

Something like when clicking this link http://www.myurl.com/gallery.html#button2:selected would auto-select the 2nd button.

Or perhaps http://www.myurl.com/gallery.html?button3=selected would auto-select the 3rd button.

I used jQuery Tabs and jQuery Selectable combination, so I need to use a direct URL to auto-select tab 3 and button 3.

Thanks

UPDATE:


  $(document).ready(function () {
            $("#iframebutton1").click(function () {
                $(".iframebuttons").attr("isselected", "false");
                $(this).attr("isselected", "true");
                parent.ClickedButton1();
            });

            $("#iframebutton2").click(function () {
                $(".iframebuttons").attr("isselected", "false");
                $(this).attr("isselected", "true");
                parent.ClickedButton2();
            });

            $("#iframebutton3").click(function () {
                $(".iframebuttons").attr("isselected", "false");
                $(this).attr("isselected", "true");
                parent.ClickedButton3();
            });
        });  
 #iframebutton1 { float:left; width:110px; height:34px;  cursor:pointer; }
        #iframebutton1[isselected = "true"] { color:#ff0000;}
        #iframebutton1[isselected = "false"] { color:#0000ff; }
        #iframebutton1:hover[isselected = "false"] {color:#ff0000; }

        #iframebutton2 { float:left; width:110px; height:34px;  cursor:pointer; }
        #iframebutton2[isselected = "true"] { color:#ff0000;}
        #iframebutton2[isselected = "false"] { color:#0000ff; }
        #iframebutton2:hover[isselected = "false"] {color:#ff0000; }

        #iframebutton3 { float:left; width:110px; height:34px;  cursor:pointer; }
        #iframebutton3[isselected = "true"] { color:#ff0000;}
        #iframebutton3[isselected = "false"] { color:#0000ff; }
        #iframebutton3:hover[isselected = "false"] {color:#ff0000; }
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://akacija.ba/tabs.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Example of my problem</title>
</head>
<body>

 <div id="tabs">
 <ul>
    <li><a href="#tabs-1" id="iframebutton1"  class="iframebuttons" isselected="true"  value="iframebutton1">BUTTON 1</a></li>
    <li><a href="#tabs-2" id="iframebutton2"  class="iframebuttons" isselected="false" value="iframebutton2">BUTTON 2</a></li>
    <li><a href="#tabs-3" id="iframebutton3"  class="iframebuttons" isselected="false" value="iframebutton3">BUTTON 3</a></li>
  </ul>
  <div id="tabs-1">
    <p>THIS IS TAB 1 AND THIS TAB IS AUTO SELECTED WHEN YOU OPEN THIS PAGE</p>
  </div>
  <div id="tabs-2">
    <p>THIS IS TAB 2 AND THIS TAB IS NOT AUTO SELECTED</p>
  </div>
  <div id="tabs-3">
    <p>HOW TO OPEN THIS TAB DIRECTLY USING URL BUT WITH BUTTON 3 TO BE SELECTED INSTEAD OF BUTTON 1 WHICH IS AUTOSELECTED. I USE www.myurl.com/index.html#tabs-3 , BUT BUTTON 1 IS STILL SELECTED INSTEAD OF BUTTON 3</p>
  </div>
</div>

</body>
</html>
  • 1
    Question not clear. Please clarify what you mean here: `by opening url` and `i need direct URL to tab 3 and button 3 to be selected` – cssyphus Apr 14 '16 at 21:32
  • 1
    You're best off providing some code, but if I'm understanding correctlly, you'll want to read some URL parameters, and perform an action on your DOM based off the values. You can start here: [How to get the value from the URL parameter](http://stackoverflow.com/questions/979975/how-to-get-the-value-from-the-url-parameter) – elzi Apr 14 '16 at 21:39
  • I made one example of my problem, i will edit my post and put the code inside – Elvedin Dev Salkanović Apr 14 '16 at 23:04
  • If your problem is just to catch the Url and make the selection depends on the URL. Then it might help you [How can I get query string values in JavaScript?](http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript) – hmd Apr 22 '16 at 06:37

0 Answers0