Microsoft Dynamics 365 CRM

How to Add or Remove class using jQuery in MS Power Portals ?

The addClass() or removeClass() methods are used to add the CSS classes when there is a need to add to our webpage, Basic form and Advanced form…etc. when there is some event listener or to create some kind of effect.

Now, will see how can we add a CSS class or remove a CSS class using jQuery.

Syntax:😀😀

Adding a class:

$('selector').addClass(class_name);

Removing a class:

$('selector').removeClass(class_name);

Example: If Alpha field value equal to true enable the button else disable the button.

$(document).ready(function(){
//Adding class to disable the button 
$('#IdoftheButton').addClass('disabled');
// Getting the value of Alpha.
var alpha = $("#alpha").val();  
 // Check condition alpha equal to true or not.
    if(alpha == true)
        {
// Remove the class to enable the button
 $('#IdoftheButton').removeClass('disabled');
            }
    else{
// Adding class to disable  the button 
$('#IdoftheButton').addClass('disabled');
}
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to Left Align, Right Align, and Center Align Text using jQuery in ms power Portals

Using below syntax we can align the text.

$('.class').css('css property','alignment');

Example:

$(document).ready(function(){
   $('.myClass1').css('text-align','left');
   $('.myClass2').css('text-align','center');
   $('.myClass3').css('text-align','right');
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to Get current entity logical name and record ID in Basic &Advanced forms of MS Power Portals using jQuery

Let see how to Retrieve the current entity logical name and record ID in Basic Forms.

$(document).ready(function(){
    // Getting the Entity Logical
    var entityLogicalName = $("#EntityFormControl_EntityFormView_EntityName").val();
   // Getting the Record ID 
    var recodId = $("#EntityFormControl_EntityFormView_EntityID").val();
 });

2. Now, will see how to Retrieve the current entity logical name and record ID in Advanced Form Step.

$(document).ready(function(){
// Getting the Entity Logical
    var entityLogicalName = $("#EntityFormControl_EntityFormView_EntityName").val();
  // Getting the Record ID 
    var recodId = $("#EntityFormControl_EntityFormView_EntityID").val();
 });

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

On click of Custom Button Open Modal Popup and display HTML Fields using jQuery in MS Power Portals

Scenario: On Contact us Basic Form Insert Beside Submit Button Reject Button on click of that open popup with the fields of Full Name, Email address, Comments and Upload File along this place in footer submit and close button.

Step 1: Get the id of Submit button.

Step: 2 Go to Portal Management and from their select Contact us Basic Form and open then click on Additional settings Tab in that custom JavaScript section.

Step3: Write the code as shown below and paste it in custom JavaScript section of contact us basic form.

$(document).ready(function(){
$('#InsertButton').after('<a><button type="button" data-toggle="modal" data-target="#myModal" class="btn btn-primary">Reject</button><!-- Modal --><div id="myModal" role="dialog" class="modal fade"><div class="modal-dialog"><!-- Modal content--><div class="modal-content"><div class="modal-header"><button type="button" data-dismiss="modal" class="close">×</button><h4 class="modal-title">Details</h4></div><div class="modal-body"><form><div class="form-group"><label for="fullmame">Full Name</label><input type="text" id="fullname" class="form-control"></div><div class="form-group"><label for="emailaddress">Email address</label><input type="email" id="emailaddress" placeholder="name@example.com" class="form-control"></div><div class="form-group"><label for="comment">Comments</label><textarea rows="5" id="comment" class="form-control"></textarea></div> <div class="form-group"><label for="inputfile">Upload File</label><input type="file" id="uploadfile"></div></form></div><div class="modal-footer"><button type="button" data-dismiss="modal" onclick="submitData()" class="btn btn-primary">Submit</button> <button type="button" data-dismiss="modal" class="btn btn-default">Close</button></div></div></div></div></a>');
 });

Step4: Click on Save Button as shown in the below image.

Step5: Go to portals Editor and sync Configuration and Browse the website as shown the below images.

Step6: Check your functionality is working as expected or not.

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to Convert Text to Uppercase/Lowercase using jQuery in ms crm portals.

In this post, we will learn about how to uppercase and lowercase all the characters of the input box/ Fields and Variable values and retrieve all text as uppercase and lowercase using jQuery.

Uppercase using jQuery:

Scenario: Convert the whole URL to UpperCase.

$(document).ready(function(){
// get the url of window/browser.
var windowURL =window.location.href;
// convert the retrieved URL to Uppercase.  
var upperCase =  windowURL.toUpperCase();
alert(upperCase );
});

Lowercase using jQuery:

Scenario: Convert the URL to LowerCase.

$(document).ready(function(){
// get the url of window/browser.
var windowURL =window.location.href;
// convert the retrieved URL to Lowercase.  
var lowerCase =  windowURL.toLowerCase();
alert(lowerCase );
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to use jQuery keyup() method in ms power portals

The keyup() is an inbuilt method in jQuery which is used to trigger the keyup event whenever User releases a key from the keyboard. So, Using keyup() method we can detect if any key is released from the keyboard.

Syntax:

$(selector).keyup(function)

Here selector is the selected element.

Parameters: It accepts an optional parameter as a function which gives the idea whether any key is pressed or not.

Return values: It returns whether any key is pressed or not and accordingly change the background color.

jQuery code to show the working of keyup() Method:

Method #1: Scenario : check if a keyboard key is released after being pressed.😉

$(document).ready(function(){
$("input").keyup(function(event) {
 
        alert("You released a key");
    });
   });

Method #2: Scenario : change background color of the page whenever a key is released from the keyboard.😎

$(document).ready(function(){ 
   $("input").keyup(function(event) {
     var colors = ['red', 'blue', 'green', 'grey',
                 'black', 'white', 'teal', 'yellow'];
    var i = 0; 
        $('body').css('background-color', colors[i]);
        i++;
        i = i % 9;
  
    });
});

For more Interesting updates Subscribe our YouTube channel 👍👍: Click Here to Subscribe

How to use jQuery keydown() method in ms power portals

In this post, we show you how to use jQuery keydown() method in ms crm portals.

When you press a key on the The keydown() is an inbuilt method in jQuery which is used to trigger the keydown event whenever User presses a key on the keyboard. If the key is kept pressed, the event is sent every time the operating system repeats the key. So, Using keydown() method we can detect if any key is on its way down.

Syntax:

$(selector).keydown(function)

Here selector is the selected element.
Parameter: It accepts an optional parameter as a function which gives the idea whether any key is pressed or not.
Return values: It returns whether any key is pressed or not or which key is pressed.
jQuery code to show the working of keydown() Method:

Method 1: Scenario: check if a key is on its way down.😀😀

$(document).ready(function(){
$("input").keydown(function(){
        alert("Mohammed Shafiuddin from Joyful Learning 365 pressed down a key");
    });
});

Method 1: Scenario: check which specific key is pressed down from the keyboard and the event keyCode and event which will return a UNICODE value of the pressed key, Both are browser specific.🤠

$(document).ready(function(){

$("input").keydown(function(){
    var key = (event.keyCode ? event.keyCode : event.which);
 
    if (key >= '65' && key = '96' && key = '48' && key = '112' && key <= '123')
        alert('You pressed FUNCTION key - ' + (key - 111));
 
    else if (key == '144')
        alert('You pressed NUMLOCK key');
 
    else if (key == '145')
        alert('You pressed SCROLL LOCK key');
 
    else
        alert('You pressed SPECIAL CHARACTER key');
 
});
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to use jQuery keypress() method in ms power portals

In this post, we show you how to use jQuery keypress() method in ms crm portals.

The keypress() method in jQuery is used to trigger the keypress event or attaches a function to execute when a key of the keyboard is press down, i.e., when a keypress event occurs. This method can be used to check whether any keyboard key is pressed or not.

This method doesn’t consider the keyboard buttons like Ctrl, Alt, Shift, Esc. We can use the keydown() method to check these keys. The keypress event is similar to the keydown event.

Syntax

The keypress() method is used with or without using any argument. The syntaxes of using the keypress() method are given as follows –

Trigger the keypress event

$(selector).keypress()

Attach a function to execute when a keypress event occurs.

$(selector).keypress(function)

The function mentioned in the above syntax is the optional parameter. It specifies the function that executes when keypress event triggers.

$(document).ready(function(){
$("#Id").keyup(function(){
  // Do Something..
});
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe.

How to reload web page using jQuery in ms power portals

In this post, we show you how to reload web page using jQuery in ms crm portals.

$(document).ready(function() {
function ReloadPage() { 
   location.reload();
};
});

If you want to reload page after certain time then use below code.

$(document).ready(function() {
  setTimeout("ReloadPage()", 10000); 
});

location.reload() will reload the page again. The advantage of location.reload() is that it works with all the major browsers.

If you want to reload the page on click of button, then you can call location.reload() on button click event. See below jQuery code.

$(document).ready(function() {
     $('#buttonId').click(function() {
             location.reload();
       });
});

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe

How to Auto refresh page using HTML tag in ms power portals

In this post, we show you how to refresh page.

It is a HTML tag which you need to put in the head section of your page and your page will get refreshed automatically after specified interval.

<meta http-equiv="refresh" content="10">

The meta tag with “http-equiv” is used to refresh the page.

This attribute tells the browser that this meta tag is sending an HTTP command rather than a standard meta tag.

Refresh is an actual HTTP header used by the web server.The content attribute in the tag is having value in seconds.

As per the above code, it is set to 10, which means after 10 seconds your page will get refreshed or reloaded.

For more Interesting updates Subscribe our YouTube channel: Click Here to Subscribe