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

Mask column

Hello,

How to set this mask "#00° 00' 00'' / #000° 00' 00''" to a column? It's a mask to enter gps localization values.

Thanks!

3 Replies

AR Ajith R Syncfusion Team February 17, 2016 12:31 PM UTC

Hi Jorge,

Thanks for using Syncfusion products.

Query 1: How to set this mask "#00° 00' 00'' / #000° 00' 00''" to a column?

We suggest you to use QueryCellInfo client side event and set the corresponding format using grid formatting method to achieve your requirement. Refer the below code snippet for further details.


<ej:Grid ID="Grid" runat="server" AllowPaging="true">

        <ClientSideEvents QueryCellInfo="cellInfo" />

        ---------

        ---------

</ej:Grid>


<script type="text/javascript">

     function cellInfo(args) {           

            if (args.column.headerText == "GPS") {

                if (args.text.indexOf("°") == -1) {

                    var dms = getDMS(args.data.Location["Latitude"]); // Get DMS value from latitude

                    // Set DMS format using grid formatting method

                    var text = this.formatting("{0:D2}", dms.degree) + "°" + this.formatting("{0:D2}", dms.min) + "'" + this.formatting("{0:D2}", dms.sec) + "''";

                    $(args.cell).text(text); // Set formatted text to the cell

                }               

            }

        }       

        function getDMS(val) {

            // convert decimal degree to DMS

            var dms = {};

            var degree = dms["degree"] = Math.floor(val);

            var min = dms["min"] = Math.floor((val - degree) * 60);

            dms["sec"] = Math.floor((val - degree - min / 60) * 3600);

            return dms;

        }

</script>



Query 2: It's a mask to enter gps localization values.

We suggest you to use EditTemplate for the corresponding column to render Mask control while editing in the Grid. Please refer the below code snippet and UG Documentation for further details.

<ej:Grid ID="Grid" runat="server" AllowPaging="true">       

        <Columns>

            --------

            --------

            <ej:Column Field="Location.Latitude" HeaderText="GPS" Width="100" Type="String">

                <EditTemplate Create="create" Read="read" Write="write" />

            </ej:Column>

        </Columns>
</ej:Grid>

<script type="text/javascript">

        function create() {

            return $("<input>");

        }


        function write(args) {

            args.element.ejMaskEdit({ width: "100%", maskFormat: "##° ##' ##''", value: args.rowdata.Location !== undefined ? getMaskValue(args.rowdata.Location["Latitude"]) : "" });

        }


        function read(args) {

           return args.ejMaskEdit("get_UnstrippedValue");

        }
    </script>


UG Doc: http://help.syncfusion.com/aspnet/grid/editing?cs-save-lang=1&cs-lang=html#cell-edit-template

Online Demo: http://asp.syncfusion.com/demos/web/grid/edittemplate.aspx

For your convenience we have created a simple sample and the same can be downloaded from the below link.

Sample: http://www.syncfusion.com/downloads/support/forum/122089/ze/Sample-746212353

We have created the above sample with data structure of [{Location: {Latitude: 11.11, Longitude: 23.43}}]. Please get back to us If you need the solution for any other data structure and provide us more detailed information regarding your requirement, so that we can provide you the solution based on your requirement.

Please let us know if you have any further concerns.

Regards,
Ajith R


JP Jorge Pampin February 18, 2016 09:06 AM UTC

Hello,
How to add the simbols '+' '-' to the mask? The latitude/longitude can be a positive or a negative value.

Thanks!


GV Gowthami V Syncfusion Team February 19, 2016 12:54 PM UTC

Hi Jorge,
 

We have an issue "MaskFormat character # not allowed +/- symbol” and created a new support incident under your account. . Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

Regards,

Gowthami V.


Loader.
Live Chat Icon For mobile
Up arrow icon