Qlik Community

Qlik Sense Integration, Extensions, & APIs

Discussion board where members can learn more about Integration, Extensions and API’s for Qlik Sense.

vasilevtodor
New Contributor II

Get value of textbox/textarea

Hello guys,

I have a problem with getting the value of the textarea of my extension. I am trying with jquery but it doesn't work:

console.log($(props.items.appearance.items.myButton).val());

Appreciate any help.

Thanks,

Todor

Tags (2)
1 Solution

Accepted Solutions
m_schindler
Contributor II

Re: Get value of textbox/textarea

Ok I don't really know why but the layout property is not assigned to the $scope, but rather to the $scope.$parent property .

If you replace your controller with the the following code you'll see an object containing properties like "layout", "component", "backendApi" etc. in the console:

controller: ['$scope', function ($scope) {

    var myExtScope = $scope.$parent;

    console.log(myExtScope);

}]

The path to your property-value will then be: myExtScope.layout.props.buttonName

(because you set the "ref" property inside the property.js myButton variable to "props.buttonName")


I think there's something wrong though because Qlik documentation states:

    "Add console.log('layout', $scope.layout); into your controller to help you find all the properties."


which is (surprisingly) wrong.


Mathias

8 Replies
m_schindler
Contributor II

Re: Get value of textbox/textarea

Hello Todor,

the "$(...)" is usually expecting an jQuery selector like:

$('#myButton') --> returns the html element with the id "myButton" (e.g. <button id="myButton">Button-Text</button> or <div id="myButton"></div>).


What you probably want is just: console.log(props.items.appearance.items.myButton)

If you want to look inside the properties-structure you can also just do a: console.log(props)

For a better understanding check out the section about custom properties in the Qlik Sense documentation (Adding custom properties ‒ Qlik Sense)

Mathias

vasilevtodor
New Contributor II

Re: Get value of textbox/textarea

My example might be a bit misleading.. because I want to get the value of my textbox/textarea.

Screenshot_1.png

This text ("dasdasd") i want.

P.S.: I have searched the help but couldn't find a solution ..

m_schindler
Contributor II

Re: Get value of textbox/textarea

Did you try my suggestions?

If you post your stripped down extension code I'm probably able to help you better.

vasilevtodor
New Contributor II

Re: Get value of textbox/textarea

Yes, this is an example of my extension with your solution.
P.S.: I dont want to get the default value but the value from the user input

m_schindler
Contributor II

Re: Get value of textbox/textarea

Ok I don't really know why but the layout property is not assigned to the $scope, but rather to the $scope.$parent property .

If you replace your controller with the the following code you'll see an object containing properties like "layout", "component", "backendApi" etc. in the console:

controller: ['$scope', function ($scope) {

    var myExtScope = $scope.$parent;

    console.log(myExtScope);

}]

The path to your property-value will then be: myExtScope.layout.props.buttonName

(because you set the "ref" property inside the property.js myButton variable to "props.buttonName")


I think there's something wrong though because Qlik documentation states:

    "Add console.log('layout', $scope.layout); into your controller to help you find all the properties."


which is (surprisingly) wrong.


Mathias

vasilevtodor
New Contributor II

Re: Get value of textbox/textarea

It works perfectly. Thanks Mathias!

vasilevtodor
New Contributor II

Re: Get value of textbox/textarea

Hello again Mathias!

Do you know how to catch the event when something is entered in the specific textbox? For example, I want to enter the name of the displayed button in this textbox.

Regards,

Todor

m_schindler
Contributor II

Re: Get value of textbox/textarea

Hello,

I don't know how to subscribe to the change event of a specific property (other than finding the textbox via a jQuery selector) but you can use the Validated Event for your extension:

Validated

Occurs if the data has been recalculated and new valid data is available.

myExtScope.component.model.Validated.bind( function () {

console.info('new value', $scope.$parent.layout.props.buttonName);

} );

More on events can be found in the documentation: AngularJS and events ‒ Qlik Sense

Mathias