locked
Can't set SearchBox placeholder

    Question

  • Hi.

    I'm been trying to set the placeholder for a SearchBox and can't seem to do it either in the data-win-options of the control in html or with javascript.

    Any suggestions?

    Thanks!

    Christine

    Wednesday, January 22, 2014 12:50 AM

Answers

  • Hi,

    You can code like below:

    <div 
        data-win-control="WinJS.UI.SearchBox" 
        data-win-options="{ placeholderText : value}" >
    </div>

    See SearchBox.placeholderText property

    Best Wishes!


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Thursday, January 23, 2014 1:33 AM
  • Hi Christine,

    Try setting the placeholderText property rather than "placeholder".

    --Rob

    Thursday, January 23, 2014 3:55 PM
    Moderator

All replies

  • Hi,

    You can code like below:

    <div 
        data-win-control="WinJS.UI.SearchBox" 
        data-win-options="{ placeholderText : value}" >
    </div>

    See SearchBox.placeholderText property

    Best Wishes!


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Thursday, January 23, 2014 1:33 AM
  • Thank you for your response, but this is not helpful as it is just a restatement of the online documentation and doesn't really tell the developer how to format the placeholder, ie: quotes, single quotes, etc. And I should have been more specific. Here is the code I have. My placeholder is not working/showing. So I am wondering how this is supposed to be formatted.

    <div class="searchBox"
            data-win-control="WinJS.UI.SearchBox"
            data-win-options="{
            placeholder: 'Enter your search text here',
            focusOnKeyboardInput: true
            }">
    </div>

    Regards,

    Christine

    Thursday, January 23, 2014 3:43 PM
  • Hi Christine,

    Try setting the placeholderText property rather than "placeholder".

    --Rob

    Thursday, January 23, 2014 3:55 PM
    Moderator