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.
Unfortunately, activation email could not send to your email. Please try again.

Watermark text in filtering cell

Thread ID:

Created:

Updated:

Platform:

Replies:

116967 Jul 11,2014 05:14 AM Jul 14,2014 11:32 AM ASP.NET MVC 1
loading
Tags: Grid
PawelS
Asked On July 11, 2014 05:14 AM

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

Ragavee U S [Syncfusion]
Replied On July 14, 2014 11:32 AM

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

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;