We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Watermark text in filtering cell

Hi,
I'm testing trial version Syncfusion controls (12.1.0.49) for ASP.NET MVC.
Is there a way to insert the watermark text ("Set filtering") to a filtering cell in grid?  
Thanks

1 Reply

RU Ragavee U S Syncfusion Team July 14, 2014 03:32 PM UTC

Hi Pawel

 

Thanks for using Syncfusion Products.

 

We have analyzed your requirement to insert watermark text to the filtercell in grid. This can be achieved using the following workaround solution. Please refer the below code snippet.

 

<style>

    .water {

        opacity: 0.4;

        font-style: italic;

    }

</style>

 

@(Html.EJ().Grid<SampleApp.Models.OrdersView>("Grid")

. . .

.ClientSideEvents(eve=>eve.Create("create"))             

        .Render())

 

<script type="text/javascript"> 

    function create(args) {

        $(".e-filtertext").addClass('watermark').text('Set Filtering');

        $('.watermark').on('focus', function () {

            var $tb = $(this);

            if ($tb.val() == 'Set Filtering') {

                $tb.val('');

                $tb.removeClass("water");

            }

        }).on('blur', function () {

            var $tb = $(this);

            if ($.trim($tb.val()) == '') {

                $tb.val('Set Filtering');

                $tb.addClass("water");

            }

        }).blur();

    }

</script>

 

For your convenience, we have created a simple sample implementing your requirement. The sample can be downloaded from the attachment.

 

In the sample attached, we have added a css class to the filtercell in the create event of the grid.

 

Please let us know if you need any further assistance.

 

Regards

Ragavee U S


Attachment: SampleApp_ccbf8b0.zip

Loader.
Live Chat Icon For mobile
Up arrow icon