- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 03:53 AM
Hi All,
I am new to Service Portal and I have never worked on it before.
The requirement is- I have to 2 text box fields on the page- for eg- first name and last name. I have a Submit button below those fields.
So when the user fills the first name as 'Abel' and last name as - 'Tuter', and clicks on Submit button, the initial of first name and last name- say-AT should be displayed.
I have tried below code but its not working-
HTML-
<html>
<body>
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname" ><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" ><br><br>
<button class="btn btn-primary" ng-click="c.clickButton()">Submit</button>
<h1>
{{c.data.result}}
</h1>
</body>
</html>
Client controller-
api.controller=function($scope) {
/* widget controller */
var c = this;
c.clickButton = function() {
c.data.firstname=data.fname;
c.data.lastname=data.lname;
c.data.result="";
c.server.update();
}
}
Server script-
(function() {
/* populate the 'data' object */
/* e.g., data.table = $sp.getValue('table'); */
if(input)
{
data.firstname=input.fname;
data.lastname=input.lname;
var a=data.firstname[0][0];
var b=data.lastname[0][0];
var res=a+b;
data.result = res;
}
})();
Could somebody please help me resolve it?
Thanks in advance.
Solved! Go to Solution.
- Labels:
-
Service Catalog
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 05:40 AM - edited 11-01-2022 05:40 AM
The below code worked for me:
HTML:
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname" ><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" ><br><br>
<button class="btn btn-primary" ng-click="c.clickButton()">Submit</button>
<h1>
{{data.result}}
</h1>
Client:
c.clickButton = function() {
c.data.firstname=$('#fname').val();
c.data.lastname=$('#lname').val();
c.server.update();
}
Server:
if(input)
{
data.result = input.firstname.charAt(0) + input.lastname.charAt(0);
}
Please mark the answer correct/helpful accordingly
Raghav
MVP 2023
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 04:00 AM - edited 11-01-2022 04:05 AM
Try below, it should give you the initials in <h> tag:
<h1>
{{data.result}}
</h1>
Also in client script make below changes:
c.data.firstname=$('#fname').val();
c.data.lastname=$('#lname').val();
Try to alert in client side if you are getting the values of $('#fname').val(); or $('#lname').val();
Raghav
MVP 2023
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 04:17 AM
Hi,
I made the changes as per your suggestion.
But i am getting these errors-
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 04:23 AM
c.data.firstname=document.getElementById('fname').innerHTML or use ocument.getElementById('fname').value()
and same for last name
Raghav
MVP 2023
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-01-2022 05:08 AM - edited 11-01-2022 05:10 AM
When i used- document.getElementById('fname').value(), it is not even showing alert in client controller and when i used- document.getElementById('fname').innerHTML, it showing alert but having empty value.