CODEWITHSUNDEEP
javascriptjquerysugarcrmsuitecrm
Josh Whitlow
Josh Whitlow

Reputation: 481

SuiteCRM - jQuery Masked Input Plugin Not Working

I have checked several other threads on here related to masked input plugins not working and was unable to find any answers:

Masked Input Plugin not working

jQuery Masked Input plugin not working on form input?

JQuery Masked Input plugin doesn't work

I should preface this by saying that my programming knowledge is rather limited. I have help, but that help isn't always available.

I am attempting to use this plugin

My Version #: SuiteCRM Version 7.2.1, Sugar Version 6.5.20 (Build 1001)

So I added the jQuery javascript library file and the jQuery plugin from digitalbrushes website and put them both in /admin/custom/include/javascript/

Then under the module I am currently working on which in this case is the Contracts module, the file I am working on is here: /admin/custom/modules/AOS_Contracts/views/view.edit.php

Below is the file:

<?php 
if(!defined('sugarEntry') || !sugarEntry) die('Not A Valid Entry Point'); 

require_once('include/MVC/View/views/view.edit.php'); 

class AOS_ContractsViewEdit extends ViewEdit {

// function displaySubPanels() {
//  return '';
// }

function display(){
    $js = <<<JS

            <script src="/admin/custom/include/javascript/jquery.min.js" type="text/javascript">
            <script src="/admin/custom/include/javascript/jquery.maskedinput.min.js" type="text/javascript">
            var \$j = jQuery.noConflict();
                \$j("#home_phone_c").mask("(999) 999-9999");
                \$j("#work_phone_c").mask("(999) 999-9999");
                \$j("#mobile_phone_c").mask("(999) 999-9999");
                \$j("#inital_deposit_amount_c").mask("999,999,999,999,999.99");
                });
            </script>
    JS;
        parent::display();
        echo $js;

    }

}

When I load the page and click in the fields, there is no masks present, in my chrome console I am only getting an unrelated error in my style.js file that says:

"Uncaught TypeError: $.cookie is not a function"

I have already tried wrapping this in {literal} tags as suggested by this answer: Adding custom jQuery validation in SugarCRM editview, nothing changed. I'm not really certain how or if the .ready(function() is applied to this if it is necessary. I didn't think it was because of parent::display();.

I have tried this same page in Chrome, Firefox, Safari, and IE.... nothing. I also cleared my cache and cookies after I made the changes to ensure I was getting fresh results. I have also done a quick repair and rebuild on SuiteCRM everytime (although that should be completely unnecessary) just to cover my bases.

Upvotes: 3

Views: 1083

Answers (2)

Abdur Rehman
Abdur Rehman

Reputation: 3293

You need to add JS file in metadata using "include". Then write your code in that file. Writing java-script code inside PHP view is not suggested by Sugar.

If you only need view.edit for this purpose then at the end this file will not be needed and hence get deleted. Let me know if you need further details.

Upvotes: 0

Josh Whitlow
Josh Whitlow

Reputation: 481

I was able to get help on SuiteCRM's forum.

-I needed this cookie plugin

-In my syntax above src="jquery.maskedinput.min.js" needed to be omitted.

-In my syntax above, \$j was creating an infinite error in the chrome console that only appeared once the above syntax was removed, I omitted the j and then that cleared it up!

The corrected code looks like this:

<?php 
if(!defined('sugarEntry') || !sugarEntry) die('Not A Valid Entry Point'); 

require_once('include/MVC/View/views/view.edit.php'); 

class AOS_ContractsViewEdit extends ViewEdit {

    // function displaySubPanels() {
    //  return '';
    // }

    function display(){
        $js = <<<JS

                <script src="custom/include/javascript/js.cookie.js" type="text/javascript"></script>
                <script type="text/javascript">
                var \$ = jQuery.noConflict();
                    \$("#home_phone_c").mask("(999) 999-9999");
                    \$("#work_number_c").mask("(999) 999-9999");
                    \$("#mobile_number_c").mask("(999) 999-9999");
                    \$("#inital_deposit_amount_c").mask("");
                </script>
JS;
        parent::display();
        echo $js;

    }

}
?>

Upvotes: 3

Related Questions