[onsen-ui] タグが付いた質問
219
質問
0
票
1
回答
60
閲覧数
MonacaとOnsen UIで作成したアプリがメニュー切り替えすると表示されなくなる
【作成環境】
Monaca
Onsen UI
Javascript
jQuery
【作りたいアプリ】
TOPページにカレンダーを表示したい
【今起きている問題】
読み込み時はカレンダーが表示されているが、メニュー切り替えするとカレンダーが表示されない。
【確認したこと】
・リロードすると表示される
・呼び出したい関数の中に挿入したconsole....
1
票
1
回答
417
閲覧数
frameタグの中に、YouTubeのビデオIDが設定されているangular式を指定して動画再生したい
iframeタグの中に、YouTubeのビデオIDが設定されているangular式を指定して
動画再生したいのですが、可能でしょうか。
現状、直接的にビデオIDを指定する方法が分からなかったので、
仕方なくSelectBoxを使っております。
(SelectBoxでビデオIDを選択すると、選択したIDの動画が再生出来るようになっています)
※以下参照
これを、SelectBoxを使用せずに、...
0
票
0
回答
20
閲覧数
現在表示されているpageのidを取得するにはどうすればよいですか
ons.readyメソッド内で現在画面に表示されている、つまり<ons-navigator>内でアクティブなpageのidを取得するのはどのように書けばよろしいでしょうか。
ons.ready(function() {
//ここで現在画面に表示されているpageのidを取得したい
})
0
票
1
回答
469
閲覧数
ons-modalにパラメータを渡したい
monacaのonseneUIでモーダルを表示する時にパラメータを渡して、そのパラメータを表示するようにしたいのですが、うまくいきません。
公式リファレンスは読んだのですが、具体例がないのでよくわからないです。
パラメータの渡し方・取得方法を教えてください。
現在のコード
<ons-page>
<div ng-click="modal.show({num:1}...
2
票
1
回答
1,720
閲覧数
Onsen UI のラジオボタンで初期設定をしてもチェックマークが表示されない
ons-listでRadiobutton Listを実現したく、以下のコードを実装しております。
これでコマンド $ cordova emulate ios を実行しシミュレータを表示したところ、メニューの右側(先頭のみ)にチェックマークが表示されません。
「ng-repeat」で各値を取得できているのは確認できたのですが、HTMLに生成し表示する際にうまくいってないようです。
...
3
票
1
回答
283
閲覧数
Monaca(Onsen UI)で左右にスライディングメニュー表示した場合のスワイプで閉じた時の挙動について
スライディングメニューを左右に配置した場合、
左側をスワイプ操作で閉じるときは問題なくスムーズなのですが、
右側をスワイプ操作で閉じようとすると、
左側のスライディングメニューが開いてしまいます。
例)
http://databasefaq.com/index.php/answer/103174/onsen-ui-how-to-implement-two-slide-menu-on-both-...
2
票
3
回答
4,284
閲覧数
スマホアプリでPDFを表示させたい
Monacaでスマホのアプリを作っています。
ある会場図をPDFで表示させたいのですが、どのようにさせたらよいでしょうか?
試しに下記にしてみたら、Couldn't load plug-in が表示されました。
<ons-page>
<object data="img/map.pdf" id="info_map" type=&...
0
票
1
回答
462
閲覧数
ページスタックを自作する方法
トップページをAとして
A → B → C
という遷移と
A → X → Y
という遷移があります。
それぞれはpushPage()とpopPage()で行き来できます。
今回、CからYに遷移させたいのですが、その際の戻る操作は以下のように遷移させたいのです。
しかしその方法がわかりません。
C → Y → X → A(TOP)
ページスタックを自作するなど方法はありますでしょうか?...
5
票
1
回答
1,484
閲覧数
ons-lazy-repeatで表示したons-listをons-pull-hookで更新したい。
表題の通り、ons-lazy-repeatで表示したons-listをons-pull-hookで更新したく
下記公式ドキュメントのサンプルコードを動かし、いろいろ試したのですが
ドキュメントに記載されている情報のみでは対応が難しい状況です。どのように実装すればよいのでしょうか。
http://ja.onsen.io/reference/ons-lazy-repeat.html
1
票
1
回答
4,518
閲覧数
monaca Onsen UIでangular.moduleをするとエラーが起こる
monacaでOnsen UI Tabberを使用しています。
JsonでHTMLタグ入りの変数を$scopeし、ng-bind-htmlで表示しようとしていますが
ngSanitizeを読み込むために
var app=angular.module('app', ['ngSanitize']);//(1)
をすると
Error: [ng:areq] Argument '...
0
票
1
回答
63
閲覧数
ons-switch の setChecked を使用するとエラーが発生する
ons-switchのsetCheckedについて詳しく教えてほしいです。
どんなに試してもエラーしか出ません。
JavaScript
B = document.getElementById("sekasi");
B.setChecked(false);
HTML
<ons-switch id="sekasi" onclick="...
0
票
1
回答
581
閲覧数
InAppBrowserでのページ遷移時のloading表示について
初心者の質問ですみせん。
monacaにてInAppBrowserを使ってwebサイトへ飛ばした際に、webサイトが表示されるまでの間にloading画面を付けたいのですが、どのようにすればいいでしょうか。
分かる方是非、お助け下さいm(__)m
0
票
1
回答
1,010
閲覧数
Onsen UIで遷移先のページを別htmlファイルとして用意してそのファイルの中に<template>を使用したい。
monacaでOnsen UI とJavaScriptテンプレートを使ってSPAをつくっています。
pushPageでページを遷移するとき、別のhtmlファイルを用意してそのファイルにindex.htmlと同じようなtemplateを使用したいのですが、やり方が分かりません。
index.htmlでtemplateを使用すると動くのですが、page2.htmlを別のファイルで用意すると
...
0
票
1
回答
130
閲覧数
アラートダイアログのタイトルを非表示にしたい
画像の赤丸で囲った部分を非表示にする方法はありますでしょうか?
0
票
1
回答
344
閲覧数
OnsenUIで複数ページを使用するときの戻るボタンが実装できない
こんにちは。
Monacaのアプリ製作プラットフォームを使っています。
使用しているJSフレームワークは、OnsenUI V2 JS Minimumです。
OnsenUIで複数ページを設定して、飛ぶ先のページに × のようにページを消して戻る仕組みを作っています。具体的には、index.html→page1.html→index.htmlという風に母体のindex.htmlに戻れるようにしたいです。...
0
票
1
回答
291
閲覧数
onsen-UIが読み込まれていない?
onsen-UI使っています。
Visualstudioを使っています。
UIのスライドメニューというか、ハンバーガー?のアイコンの動きとページ偏移は、正常にできます。
でも、下記のソースのように、clickの動作とセンサーの部分が動きません。
色々ネット検索して試行錯誤していますが、解決できず困っています。
ご教授頂けましたら幸いです。
onclickのイベントは使えます。
<...
0
票
1
回答
102
閲覧数
スイッチの状態を取得する公式サイトのコードが動かない
公式サイトの「スイッチの状態取得」がコピペでも動作しない様ですが、仕様変更されたのでしょうか?
html
<ons-switch id="switch-1"></ons-switch>
JS
var switch = document.getElementById('switch-1');
ons.notification.alert('Value is ' + ...
0
票
1
回答
3,457
閲覧数
サイトが表示できない
monacaを使ってwebサイトを表示するアプリを作っているのですが、端末上でアプリを動かすと
net::ERR_BLOCKED_BY_RESPONSE
と表示されてしまいmonacaデバッカー上でも
Refused to display 'http://www.アドレス名.jp/' in a frame because it set 'X-Frame-Options' to '...
1
票
1
回答
426
閲覧数
<ons-tab>タブをタップした時のアニメーションを変更したい(カスタマイズ)
onsen uiで以下の機能を実装したいと考えています。
タブ切り替え時のアニメーションにons-navigatorの画面遷移時に設定できる"slide"のようなアニメーションでタブを切り替えたいと考えているのですが、ons-tabbarのオプションには"slide"が設定できないので他の方法で実装したいのですが、実装方法がわかりません。
上記実装をonsen ...
0
票
1
回答
192
閲覧数
onsenuiのons-lazy-repeatで生成したons-list-item内の値を関数に渡す方法について
monaca cloudIDEでアプリ開発をしています
ons-lazy-repeatで生成したons-list-itemを列挙するjavascriptを書いているのですが,
このlist-itemをタップした際に実行される関数
onclick="js_list2.onClickListItem()
に値を2つ以上渡す方法がわかりません(↓...
1
票
0
回答
167
閲覧数
<ons-navigator>と<ons-template>を指定したアラートダイアログ
ons-navigatorタグとons-templateタグを指定するとアラートダイアログが利用できません。
http://codepen.io/anon/pen/mJxEWN
ons.bootstrap()
.controller('NotificationController', function($scope) {
$scope.alert = ...
0
票
1
回答
1,763
閲覧数
Monaca Onsen UI で開閉式のコンテンツを実現したい
jQuery Mobile で作成したコンテンツを、Onsen UI に移植する作業を行っています。
jQuery Mobile 側で「開閉式のコンテンツ」
<div data-role="collapsible">
の部分があるので、これを Onsen UI で実現したいと思います。
Onsen UI のコンポーネント一覧を探したところ、...
1
票
1
回答
509
閲覧数
OnsenUI + Android4.0-4.3でpushPage後の元ページが先頭へ移動する
Android4.0 ~ 4.3でons-pageをスクロールさせた後、pushPageで新しいページを追加すると、追加元ページのスクロールポジションが初期化されます(0になる)。
エミューレータと実機の両方でこの現象が発生
Android4.4以上やiOSでは、この現象が発生しない
Android4.3においてはgulp ...
0
票
1
回答
744
閲覧数
AngularJSでデータ入力して、別のページにTodoリストのようにリスト追加する機能を作りたい
サンプルのOnsen UI TabbarにPage1.htmlは入力フォーム、Page2.htmlは入力した結果を出力する形式になっております。AngularJSでPage1上でテキスト入力させ、Page2にPage1で書いたテキストを表示させることはできましたが、Page1でテキスト入力し送信ボタンを押して、Page2にonsenUIのons-lazy-...
2
票
2
回答
1,116
閲覧数
Onsen UIとjQuery Mobileを組合せた場合における制限の有無について
Onsen UIとjQuery Mobileを組合せてHTML5ハイブリッドアプリを開発した際に、
何か制限などはあるのでしょうか?
全体としては、PhoneGap+Onsen UI+jQuery Mobile+Backbone.jsでの実装を考えています。
Onsen UI側、jQuery Mobile側どちらかで制限が出てしまう場合は
事前に把握しておきたいため、質問致しました。
...
4
票
1
回答
317
閲覧数
angular2 ons-navigator
angular2 ons-navigator ons-carouselを使ったページを作成していますが、以下の構成で実行すると*ngForが展開されません。
app.ts
@Component({
selector: 'app',
template: '<ons-navigator #myNavigator [page]="page"></ons-...
0
票
1
回答
667
閲覧数
Onsen UIで遷移先のページを別htmlファイルとして用意する方法(非Angular)
Onsen UI(v2系)でSPAをつくっています。
AngularやVueなどのフレームワークを使わないで、構築しています。
ons-list-itemをクリックすると、hoge.htmlに遷移し、戻るボタンでまたindex.htmlに戻るとしたいです。このとき,hoge.htmlはindex.html内にtemplateとして書き込むのではなく、別ページ(別ファイル)として読み込みたいです。...
1
票
0
回答
353
閲覧数
onsenuiのtheme切り替えがうまくいかない
お世話になります。
monacaクラウドでonsenuiのcssを変更すると画面が真っ白になってしまいました。
回復手段・確認すべき場所はどのようなものがありますか?
行った手順
Monacaクラウドでプロジェクトを開く
「ファイル」-「JS/CSSコンポーネントの追加と削除」を選択
OnsenUI(Monaca Version)Ver=1.3.11の設定ボタンをクリック
「blue-...
0
票
1
回答
454
閲覧数
v-ons-tabbar と v-ons-splitter を使って多くのページを扱いたい
onsenui初心者です。
tabbar,splitterを組み合わせて使いたいのですが、tabbarではメイン機能4つのページを切り替えて使い、splitterでは管理機能など使用頻度が低いページを複数表示して使用したいと考えています。
tabbarで表示するメイン機能4つはtabbarで切り替えできるのですが、splitterで表示する他のページへ遷移させる方法で悩んでいます。
...
1
票
3
回答
6,632
閲覧数
ONSEN UIのpopPage()で戻った場合に遷移前のデータを反映させたい
Monaca
ONSEN UI 1.2.2
AngularJS 1.3
タイトルだけだとわかりにくいと思いますが下記のような動作を想定しています。
・ページA(起点ページ)pageAController
フォームパーツなどがあり、ユーザーがデータを入力するページ。
検索ボタンを押すとページBへ進む。
・ページB(ページAからしかこない)pageBController
ページAから遷移され、...
0
票
1
回答
151
閲覧数
Onsen-UI list-itemを<ol><li>のような順番つきにする方法
Onsen-UIのリスト表示で、項目の先頭に、
HTMLの<ol><li>で実現されるような連番を自動で
振ることができるでしょうか。
0
票
1
回答
635
閲覧数
Onsen UIを使った背景の画像
Onsen UIを使用して背景に画像を張りたいのですが
HTMLのCSSを使用して
body { background-image : url("画像");
font-family: 'Open Sans', sans-serif;
}
としてるのですが変わりません
Onsen UIのスタイルシートを使用し変更した方が良いでしょうか?
1
票
1
回答
1,110
閲覧数
OnsenUI+GoogleMaps ons-page内で表示されない tabbarで表示したい
tabbarを使った1つのページに GoogleMapsを表示させたいのですが、うまく表示させることができません。試行錯誤の結果"ons-page"タグ内で表示できないことがわかりました。
GoogleMapsApiの使用にはプラグインを使っています。
https://github.com/mapsplugin/cordova-plugin-googlemaps
どうかお知恵をお貸しください。
...
0
票
1
回答
300
閲覧数
NCMBで、条件を指定して件数のカウントをしたい
NCMB(NIFTY Cloud mobile backend)のデータストアから、
条件を指定して件数を取得したいのですが、そのようなことは可能でしょうか。
具体的な例を以下に記載します。
name | date
-------------
A | 6/1
A | 6/2
A | 7/1
B | 6/1
上記のようなクラスがあった場合に、
[name] 毎に ...
0
票
1
回答
516
閲覧数
onsenUIを使ったWebサイトを作成する際、ページごとにファイルを分割したい
はじめまして。
onsenUIを使用してWebページを作成しています。
monacaでの開発の際には、ons-navigatorを使用してindex.htmlとは別のファイルを作成してpushPage()等できたのですが、Webページでは以下のエラーが出てしまい、動作しません。
=====
XMLHttpRequest cannot load file:///xxxx/xxx/xxxx/...
0
票
1
回答
166
閲覧数
ons-list の特定行のみ、アイコンを表示したい
ons-listの特定行(1~3行目)のみアイコンを表示したいのですが、
どのようにすればよいでしょうか。
OnsenUI v2とAngularJS v1で開発しております。
ご教授のほど、よろしくお願い致します。
<ons-list>
<ons-list-item ng-repeat="data in dataList ">
&...
0
票
1
回答
977
閲覧数
Web SQLで取得したデータをAngularJSを使って表示する方法について
Web SQLで取得したデータをAngularJSを使って表示することができず、困っております。
解決策をご存知の方、ご教授頂けないでしょうか。
↓ page1.html
<ons-page id="page1">
<div ng-controller="hoge_Controller">
<ons-list ng-repeat ="item in ...
0
票
1
回答
472
閲覧数
ons-lazy-repeat のメンバーを削除した際に詰め合わされない
複数のメンバーを持つリストから任意のメンバー削除した際、
リストのデータは削除されるのですが、空白行として残ってしまいます。
前後を詰め合わせたいのですが、どうすれば良いのでしょうか?
//編集ロジック
function funcRepeat($scope){
$scope.RepeatDelegate = {
countItems: function() {
...
0
票
1
回答
90
閲覧数
ons-lazy-repeat で itemのidを編集したい
下記の※の箇所でidの値を編集したいのですが、記述方法がわかりません。
よろしくお願いします。
function funcRepeat($scope){
$scope.RepeatDelegate = {
configureItemScope: function(index, itemScope) {
itemScope.a = "a";
...
0
票
1
回答
622
閲覧数
$applyを使っても$scopeに反映されない
Onsenを使用してアプリを作っています。
以下の順番でリストを作ろうとしています。
1.外部にデータを作成
2.アプリ起動時にindexedDBでテーブルを作成し、外部データを格納
3.ページ読み込み時、indexedDBからデータを変数に格納し、$scopeへ引き渡す
4.ng-repeatにてリストを作成
3の別関数を呼び出しているため、$applyを使っているのですが、...
0
票
1
回答
313
閲覧数
iOSのみ、checkboxのlabelが反応しません。
CSSコンポーネントにあるサンプル「Material List with Checkboxesコンポーネント(http://components.onsen.io/)」を使ってチェックボックスを作りたいのですが、iOSのみlabelがうまく反応しません。サンプルコードはそのまま使っています。
一緒に読み込んでいるonsenui.min.jsを削除すると動作するようですが、...
0
票
1
回答
906
閲覧数
AngularJSにて、変数に$scopeを代入した際の質問
スコープの基礎的な指摘になるかもしれませんが、以下の事象が起きます。
app.controller("test", function($scope){
var options = $scope.nav.getCurrentPage().options;
$scope.item = options.item; // {str:'test',int:'000000'}
$...
1
票
0
回答
121
閲覧数
MonacaアプリのiCloudへのバックアップ
単純な質問なのですが、Monacaで作ったアプリはiCloudでバックアップ可能とありますが、どのデータをバックアップするのでしょうか?
Localstrage内にある、WEB SQLやIndexedDBにあたるのでしょうか?
0
票
3
回答
940
閲覧数
ons-switchの使い方
Monaca Cloud IDEにてプログラミングの勉強をしています。
本題ですが、ons-switchのメソッド isCheckedを使ってPタグの内容を変更しようと”monaca公式ガイドブック HTML5ハイブリッドアプリ開発”を参考にやってみましたが、上手くいきませんでした。(ons-switchは表示されていますが、Pタグの内容が変更できていません)
ご教授宜しくお願いします。
&...
0
票
1
回答
534
閲覧数
Angular2×OnsenUI2 ons-tabのsetActiveTabの使い方
onsenUIとAngularjs2を使用しています。
ons-tabのメソッドのsetActiveTabを使用したいのですが使用方法がわかりません。どのように使うのでしょうか?
コードがこちらです。
@Component({
selector: 'ons-page',
template: `
<ons-tabbar #tabbar>
<ons-tab [...
0
票
1
回答
1,396
閲覧数
ons-inputの正しい使用方法は?
もしかしてドキュメントの見方が間違っているだけなのかもしれませんが、ons-inputにclass="text-input"を指定して、更にplaceholder属性も指定すると、placeholderに指定した文字が2重になって表示されます。この2つを同時に使用するのが正しいのか?間違っているのか?それとももしかすると不具合なのか?を判断することができないでいます。Ver....
0
票
1
回答
506
閲覧数
angularjsのpromise処理を使用時、onsen ui のmodalが表示されない
angularjsのpromise処理を使用時に、onsen ui のmodalが表示されずに悩んでいます。
Controllerでサービスの終了を待つ間、onsen uiのmodalを表示させたいのですが、うまくいきません。修正点がありましたら、ご教授いただければと思います。
コードは以下の通りです。10秒かかるサービスをまって、文字列を表示するサンプルです。
index.html
<...
-1
票
1
回答
743
閲覧数
monaca「RSSリーダー」アプリに記事画像も表示したい。
「monaca」と「nifty mobile backend」を使って、RSSリーダーアプリを作成しています。
monacaのドキュメントにあるサンプルアプリ『RSSリーダー』を参考にして作っているのですが、記事元の画像(WordPressで言うところのアイキャッチ画像)も表示したいと思っています。
ドキュメントは「タイトル・日付・概要文」のみの取得・表示となっており、...
0
票
1
回答
677
閲覧数
Radiobutton Listでラジオボタンをリストの右側に表示する方法
Onsen UIのパターンにRadiobutton Listがありますが、チェックの表示位置を
iOSのUIに準拠し、右側に表示させたいのです。
その方法をご存知でしたら、ご教授のほどお願いいたします。
0
票
1
回答
247
閲覧数
onsenuiがユニットテストでエラーが発生する
onsenuiを使用したハイブリットアプリを作成しています。
Karmaとjasminを使用してユニットテストをしたいのですが、
テスト実行時に下記のエラーが発生します。
Error: isWebView() method is available after dom contents loaded.
onsenuiはangularJSでDIしています。
var appModule = ...