0

So I have a lightbox which contains more divs and when I click one I want to display the text value from it into a inputText.

here is the code :

<h:form style="margin:55px; opacity:1;">
    <h:panelGrid columns="1">
        <p:inputText id="name"
            style="width:400px; box-shadow: inset 0 0px 0px"
            placeholder="Name: " />
        <br />

        <p:inputTextarea id="description"
            style="width:400px; box-shadow: inset 0 0px 0px"
            placeholder="Description: " rows="8" cols="35" />
        <br />

        <p:lightBox >
            <p:inputText id="category_input" style="width:400px; box-shadow: inset 0 0px 0px"
                placeholder="Category:  " />
            <br />
            <f:facet name="inline">
                <div id="categ_select" style="width: 600px; height: 300px; background-color: white; padding:30px">
                    <div id="categ_item" class="category_item">
                        <p>Auto - Moto - Nautic</p>
                    </div>
                    <div id="categ_item" class="category_item">
                        <p>Imobiliare</p>
                    </div>
                    <div id="categ_item" class="category_item">
                        <p>Electronice-Electrocasnice</p>
                    </div>
                    <div id="categ_item" class="category_item">
                        <p>Casa-Gradina</p>
                    </div>
                    <div id="categ_item" class="category_item">
                        <p>Moda-Frumusete</p>
                    </div>
                    <div id="categ_item" class="category_item">
                        <p>Afaceri-Servicii</p>
                    </div>
                </div>
            </f:facet>
        </p:lightBox>
        <p:inputText id="price"
            style="width:400px; box-shadow: inset 0 0px 0px"
            placeholder="Price: " />
        <br />

        <p:inputText id="city"
            style="width:400px; box-shadow: inset 0 0px 0px"
            placeholder="City: " />
        <br />
    </h:panelGrid>
</h:form>

and here is the jquery i am using :

    $('.category_item').click(function(){
       var item = $(this).text();
       console.log(item);
       $('#category_input').val(item);
});

Thank you in advance and please dont mind the id names because i focused on the functionality and not on name and stuff.

Thank you!

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Adi Purcaru
  • 48
  • 1
  • 10
  • The `` is not a jQuery element so you can't use `.val()` with it, so try to change `$('#category_input').val(item);` to `$('#category_input').value= item;`. – cнŝdk Mar 27 '17 at 15:58
  • still doesn't work with $('#category_input').value= item – Adi Purcaru Mar 27 '17 at 16:09
  • What do you get in `$('#category_input')`? Does it get your input?Try to write `console.log($('#category_input'));` and inspect it in console. – cнŝdk Mar 27 '17 at 16:11
  • this is what i get in console : http://imgur.com/a/B8H3w – Adi Purcaru Mar 27 '17 at 16:21
  • So from what I see it points to the input object, you can try to write `$('#category_input').val("0022020202");` in your console, try it and see if the input value changes. – cнŝdk Mar 27 '17 at 16:24
  • it is the same output as in the picture . r.fn.init {} and all those attributes below. I looked up for val attribute and there is no"00220020202" here: http://imgur.com/a/pDZ4M – Adi Purcaru Mar 27 '17 at 16:28
  • No I meant the input value in your html. – cнŝdk Mar 27 '17 at 16:29
  • it does not change. it remains empty – Adi Purcaru Mar 27 '17 at 16:30

0 Answers0