I am studying developing apps for iPhone at Monaca.
On the page displayed as a child screen in ons-navigator, there are the following elements:
<input type="search" id="id1">
I would like to get the value of this tag and give it as the second parameter of pushPage ("self.html", options).
Problems
Normally, document.getElementById("id1").value" allows honest access, but cannot be used with multiple elements with the same ID.
Alternatives
I couldn't think of it.
Could you please let me know if there is any usual way to use onsen-ui?
monaca onsen-ui
This is a self-answer, but I have found the following alternatives:
As I am a beginner, I am not sure if I understand correctly, so please follow me if you are an advanced person.
Data binding (?) can be done using ng-model instead of id.
<script>
varmodule=ons.bootstrap();
module.controller('searchController', function($scope){
$scope.search=function(search_keyword){
myNavigator.pushPage('self.html', {keyword:search_keyword});
};
$scope.options=$scope.myNavigator.getCurrentPage().options;
if(typeof($scope.options.keyword)=="undefined")$scope.options.keyword=";
$scope.search_keyword=$scope.options.keyword;
});
</script>
<ons-navigator var="myNavigator" page="self.html">
</ons-navigator>
<ons-template id="self.html">
<ons-pageing-controller="searchController">
<input type="search" class="search-input"ng-model="search_keyword"/>
<ons-buttoning-click="search(search_keyword)">
<div>Search>/div>
</ons-button>
</ons-page>
</ons-template>
In the first place, in javascript,
It can be retrieved as an array using getElements series.
After that, you should be able to control it as you like by identifying the target in the order of the array.
getElementsByName("name")
getElementsByTagName("tagName")
getElementsByClassName("class")
ex)
fast_input_value=getElementsByTagName("input")[0].value;
© 2024 OneMinuteCode. All rights reserved.