0

I'm using a plugin for a Wordpress site called WPShopCart. It won't offer me a way to output the product category as text anywhere; all it wants to do is display the products under that category. However, it does output a drop-down menu to jump to other categories - so it occurred to me that possibly I could use this and simply output the selected option as text. I tried:

<script> $('#category :selected').text(); </script>

To no avail. I found the file in the plugin and this is the markup/php that's written to output the drop-down menu though:

<option value="0" >All</option>
<?php 
    $cat = new WpShopcartProductCategory();
    $cats = $cat->getModels(); 
?>
<?php foreach($cats as $c): ?> 
    <?php 
        $selected='';
        if(isset( $_GET['catid']))
        {
            if( $_GET['catid'] == $c->id)
                $selected =  'selected="selected"';
        }
    ?>
    <option value="<?php echo $c->id ?>"  <?php echo $selected ?> ><?php echo $c->name.'('.$c->getProductCount($c->id).')' ?></option>
<?php endforeach; ?> 

I also tried adding my script directly in the page, in the header and in the footer with no results. Maybe someone can decipher the php markup so I can output the category name elsewhere on the page successfully?

I want to display as a title: Our Products (extracted ID or category title here).

  • No need to decipher the php, view the page source and then you know exactly what html you are dealing with. Also make sure your category selection is inside a $(document).ready(function() { //code here; }); otherwise it will try to fire the jquery before anything exists on the page. – Bollis Oct 16 '14 at 00:11
  • The code is from the source code. I also did try it with document ready but it never showed up or returned any errors. – Toasterdroid Oct 16 '14 at 01:44
  • I don't mean source code. Right click on the page and select "view source" or "inspect element" (depending on browser) and you will get the flat html of the page without the php confusing the situation. Also... what are you doing with $('#category :selected').text(); ? This might be part of the issue – Bollis Oct 16 '14 at 01:59
  • Right. I went to the source because the 'inspect element' only gave me the class name. I'm trying to get the text (category) and print it into the title of the page. I also tried taking the data and outputting it into a div with no luck. Here's the website/page set in question: [link]http://southwestdesignsinc.com/store/?catid=5 you'll see the drop-down menu there that i want to extract the text from. Thanks for your help! – Toasterdroid Oct 16 '14 at 02:36
  • Oh, ok sure. Do you mean title as in the title in the browser, ie HERE ??? – Bollis Oct 16 '14 at 04:10

1 Answers1

1
alert( $("#category option:selected").text() );

should give you the category you are after

and

 $(document).ready(function() {
    document.title = $("#category option:selected").text();
 });

will change the title in the browser, if that's what you mean.

Otherwise if you are wanting to change the title in the page, select the element with jquery and change the text like this.

$(document).ready(function() {
    $("h1").text( $("#category option:selected").text() );
});
Bollis
  • 385
  • 1
  • 11
  • This is ASP but the javascript is relevant to your question. http://stackoverflow.com/questions/1643227/get-selected-text-from-drop-down-list-select-box-using-jquery – Bollis Oct 16 '14 at 04:17
  • That second one did what I was after. Thanks a lot. You don't know how many hours I spent trying to get that little piece of code to work correctly! Thanks again. – Toasterdroid Oct 16 '14 at 12:08
  • Not a worry at all :) can be tricky until you get the hang of it. – Bollis Oct 19 '14 at 22:18