Skip to main content

Featured post

XM Cloud content sync from prod to uat or UAT to prod step by step

When working with Sitecore, it’s common to need content synchronization across environments. Today, I’ll walk you through the steps to sync content from Production to UAT/TEST and vice versa. Steps to Follow 1. Set Up Your Workspace Create a folder on your computer where you will manage the script files and exported data. Open the folder path in PowerShell to begin scripting. We need to run some scripts in PowerShell to update the folder with the basic requirements for syncing content. PS C:\Soft\ContentSync> dotnet new tool-manifest PS C:\Soft\ContentSync> dotnet nuget add source -n Sitecore https://nuget.sitecore.com/resources/v3/index.json PS C:\Soft\ContentSync> dotnet tool install Sitecore.CLI PS C:\Soft\ContentSync> dotnet sitecore cloud login If the above error occurs, you will need to run a different command to resolve the issue. PS C:\Soft\ContentSync> dotnet sitecore init now, Again run above command to open and authenticate with XM Cloud. It will be there a...

How to add,edit,update and delete in angularjs, CRUD Operation in angularJS

ADD,UPDATE,EDIT AND DELETE IN ANGULARJS

CRUD In AngularJS

I am going to show you very easy steps to do crud operation in angularjs. Now you can easily create, delete and update in AngularJS.
 Before starting to write angularjs code ,Firstly we need to add library of angularjs in our project.
Now, I am creating a Employee table to store employee information.

You may check below HTML page , I have added some basic html code and angularjs syntax inside html tag.



<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../jquery/jquery/jquery-1.11.2.js"></script>
    <script src="angular.min.js"></script>
</head>
<body ng-app="" ng-controller="empcontroller">
    <br />
    <br />
    <table>
        <tbody> <!-- This table is to enter Employee Information-->
            <tr>
                <td>Enter ID: </td><td>
                <input type="text" ng-model="id"/></td>
            </tr>
            <tr>
                <td>Enter Name: </td><td>
                <input type="text" ng-model="name"/></td>
            </tr>
            <tr>
                <td>Enter Designation: </td><td>
                <input type="text" ng-model="desg"/></td>
            </tr>
            <tr>
                <td><input type="button"
                ng-click="btnclk()" value="Save"/></td>
                <td><input type="button"
                ng-click="btnupd(id,name,desg)" value="Update"/></td>
            </tr>
        </tbody>
    </table>
    <table> <!--This table is to display the Employee Information-->
        <thead>
              <tr>
                  <td>Employee ID</td>
                  <td> Employee  Name</td>
                  <td> Employee  Designation</td>
              </tr>
       </thead>
        <tbody ng-repeat="emp in emparr">
            <tr>               
                <td ng-bind="emp.arr_id"></td>
                <td ng-bind="emp.arr_name"></td>
                <td ng-bind="emp.arr_desg"></td>
                <td><input type="button"
                ng-click="edit(emp,emparr.indexOf(emp))" value="Edit"/></td>
                <td><input type="button"
                ng-click="del(emparr.indexOf(emp))" value="Delete"/></td>
            </tr>
        </tbody>
    </table>
</body>
</html>

In the above HTML code there is two table one is for create new record and other one is for display information.

I have created one save button to save input field information in database and created validation on all fields to deny blank field.

First I would like to show you how to save information.

SAVE DATA

Now enter information in text field and click on save button to save data, It will fire btnclk() event to save information. Here I am using push method to save information in array for this I have used ng-repeate=emparr and the text boxes are bind by ng-model .all data are saved in array.

$scope.btnclk = function () {
                if (!$scope.id)
                {
                    alert("Enter ID");
                }
                else if (!$scope.name)
                {
                    alert("Enter Name");
                }
                else if (!$scope.desg) {
                    alert("Enter Designation");
                }
                else {
                $scope.emparr.push({ 'arr_id': $scope.id,
            'arr_name': $scope.name, 'arr_desg': $scope.desg });
                $scope.id = '';
                $scope.name = '';
                $scope.desg = '';
                }
            };
 
Edit Data

Please see the above image , There is showing edit option .click on edit ,selected data will show you inside text field, now you may change information according you requirement. When you click on the edit button it will pass the details according to index value of the array element.

For more information check below code to read information from array.

var key;
            $scope.edit = function (emp, indx) {
                key = indx;               
                $scope.id = emp.arr_id;
                $scope.name = emp.arr_name;
                $scope.desg = emp.arr_desg;
};



UPDATE DATA

You may see in image, There is button to update. Change the value from field and click on update button it will update information in array.
Here , Index key value identify which value should to have update .By clicking on button ng-model pass the value of Id,name and designation value as parameter and it will update in the array.
For more information check the below code to update data.

$scope.btnupd = function (id, name, desg) {
                $scope.emparr[key].arr_id = id;
                $scope.emparr[key].arr_name = name;
                $scope.emparr[key].arr_desg = desg;
                $scope.id = '';
                $scope.name = '';
                $scope.desg = '';
            };



DELETE DATA

There is delete button which you can see in image . click on delete button which data you want to delete.
Here I used array index value for delete purpose. When you click on delete button then we use splice method to remove data from array.
For more information please see the below code.

$scope.del = function (id) {
                $scope.emparr.splice(id, 1);
           };



Comments

Popular posts from this blog

Sitecore pipeline implementation

 Sitecore pipeline implementation Sitecore pipelines are a key concept in Sitecore architecture, allowing developers to add custom logic and process data at specific points during a request. Here's a general guide for implementing Sitecore pipelines: 1.        Create a custom class that inherits from the Sitecore.Pipelines.PipelineProcessor class. 2.        Override the Process method to add your custom logic. 3.        Register the pipeline processor in the Sitecore configuration file (usually the Web.config or Sitecore.config file). 4.        Determine the appropriate point in the pipeline to insert your custom logic. Sitecore provides many predefined pipelines, such as the httpRequestBegin pipeline, that you can use to insert your custom logic. 5.        Add a new node to the pipeline in the configuration file, specifying the cla...

what is the use of Icmpenum ?

  Icmpenum is a network reconnaissance tool that uses ICMP messages to identify hosts on a network and determine which ones are live and reachable. It sends out ICMP packets to a range of IP addresses and examines the responses to identify active hosts. Here are some of the uses of Icmpenum: Network scanning: Icmpenum can be used to scan a network and identify which hosts are active and reachable. This can be useful for network administrators who want to maintain an inventory of devices on their network or security professionals who want to identify potential targets for further scanning or testing. Host discovery: Icmpenum can help you identify hosts that are hidden or not responding to other types of network probes. By sending out ICMP packets and examining the responses, it can identify hosts that might not appear in other types of network scans. Troubleshooting: Icmpenum can help you identify network connectivity issues by determining which hosts are live and reachable. If you ...

Socket Programming in Python

  Example of socket programing in python. Here's a simple example of socket programming in Python: Server Side Code import socket # Create a socket object serversocket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)  # Get local machine name host = socket.gethostname()                            port = 9999 # Bind to a port serversocket.bind((host, port))                                   # Listen to at most 1 connection at a time serversocket.listen(1) print("Server is ready to receive") while True:     # Establish a connection     clientsocket,addr = serversocket.accept()           print("Got a connection from", addr)     clientsocket.send(b"Thank you for connecting")     clientsocket.close() Client Side Code import socket # Create a socket obje...

Sitecore Personalization and Experience Optimization

 Sitecore Personalization and Experience Optimization Sitecore Personalization: Sitecore Personalization is the process of delivering targeted and personalized content to individual users based on their behavior, preferences, and demographic information. This is achieved by using Sitecore's personalization features to create targeted segments and rules based on user behavior and personal data, and then delivering customized content to those users. For example, a clothing retailer might use Sitecore Personalization to show different product recommendations to users based on their previous purchases, the weather in their location, or their browsing behavior. Sitecore Experience Optimization: Sitecore Experience Optimization is the process of using data and analytics to optimize the user experience on a website. This is achieved by using Sitecore's optimization features to test and evaluate different variations of content, layouts, and designs, and then using that data to improve ...