[onsen-ui] タグが付いた質問
219
質問
0
票
1
回答
60
閲覧数
MonacaとOnsen UIで作成したアプリがメニュー切り替えすると表示されなくなる
【作成環境】
Monaca
Onsen UI
Javascript
jQuery
【作りたいアプリ】
TOPページにカレンダーを表示したい
【今起きている問題】
読み込み時はカレンダーが表示されているが、メニュー切り替えするとカレンダーが表示されない。
【確認したこと】
・リロードすると表示される
・呼び出したい関数の中に挿入したconsole....
0
票
0
回答
20
閲覧数
現在表示されているpageのidを取得するにはどうすればよいですか
ons.readyメソッド内で現在画面に表示されている、つまり<ons-navigator>内でアクティブなpageのidを取得するのはどのように書けばよろしいでしょうか。
ons.ready(function() {
//ここで現在画面に表示されているpageのidを取得したい
})
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
回答
1,007
閲覧数
Onsen UIで遷移先のページを別htmlファイルとして用意してそのファイルの中に<template>を使用したい。
monacaでOnsen UI とJavaScriptテンプレートを使ってSPAをつくっています。
pushPageでページを遷移するとき、別のhtmlファイルを用意してそのファイルにindex.htmlと同じようなtemplateを使用したいのですが、やり方が分かりません。
index.htmlでtemplateを使用すると動くのですが、page2.htmlを別のファイルで用意すると
...
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
回答
192
閲覧数
onsenuiのons-lazy-repeatで生成したons-list-item内の値を関数に渡す方法について
monaca cloudIDEでアプリ開発をしています
ons-lazy-repeatで生成したons-list-itemを列挙するjavascriptを書いているのですが,
このlist-itemをタップした際に実行される関数
onclick="js_list2.onClickListItem()
に値を2つ以上渡す方法がわかりません(↓...
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 '...
0
票
1
回答
130
閲覧数
アラートダイアログのタイトルを非表示にしたい
画像の赤丸で囲った部分を非表示にする方法はありますでしょうか?
0
票
1
回答
454
閲覧数
v-ons-tabbar と v-ons-splitter を使って多くのページを扱いたい
onsenui初心者です。
tabbar,splitterを組み合わせて使いたいのですが、tabbarではメイン機能4つのページを切り替えて使い、splitterでは管理機能など使用頻度が低いページを複数表示して使用したいと考えています。
tabbarで表示するメイン機能4つはtabbarで切り替えできるのですが、splitterで表示する他のページへ遷移させる方法で悩んでいます。
...
0
票
1
回答
151
閲覧数
Onsen-UI list-itemを<ol><li>のような順番つきにする方法
Onsen-UIのリスト表示で、項目の先頭に、
HTMLの<ol><li>で実現されるような連番を自動で
振ることができるでしょうか。
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として書き込むのではなく、別ページ(別ファイル)として読み込みたいです。...
0
票
1
回答
291
閲覧数
onsen-UIが読み込まれていない?
onsen-UI使っています。
Visualstudioを使っています。
UIのスライドメニューというか、ハンバーガー?のアイコンの動きとページ偏移は、正常にできます。
でも、下記のソースのように、clickの動作とセンサーの部分が動きません。
色々ネット検索して試行錯誤していますが、解決できず困っています。
ご教授頂けましたら幸いです。
onclickのイベントは使えます。
<...
0
票
1
回答
468
閲覧数
ons-modalにパラメータを渡したい
monacaのonseneUIでモーダルを表示する時にパラメータを渡して、そのパラメータを表示するようにしたいのですが、うまくいきません。
公式リファレンスは読んだのですが、具体例がないのでよくわからないです。
パラメータの渡し方・取得方法を教えてください。
現在のコード
<ons-page>
<div ng-click="modal.show({num:1}...
0
票
1
回答
344
閲覧数
OnsenUIで複数ページを使用するときの戻るボタンが実装できない
こんにちは。
Monacaのアプリ製作プラットフォームを使っています。
使用しているJSフレームワークは、OnsenUI V2 JS Minimumです。
OnsenUIで複数ページを設定して、飛ぶ先のページに × のようにページを消して戻る仕組みを作っています。具体的には、index.html→page1.html→index.htmlという風に母体のindex.htmlに戻れるようにしたいです。...
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
回答
581
閲覧数
InAppBrowserでのページ遷移時のloading表示について
初心者の質問ですみせん。
monacaにてInAppBrowserを使ってwebサイトへ飛ばした際に、webサイトが表示されるまでの間にloading画面を付けたいのですが、どのようにすればいいでしょうか。
分かる方是非、お助け下さいm(__)m
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
回答
516
閲覧数
onsenUIを使ったWebサイトを作成する際、ページごとにファイルを分割したい
はじめまして。
onsenUIを使用してWebページを作成しています。
monacaでの開発の際には、ons-navigatorを使用してindex.htmlとは別のファイルを作成してpushPage()等できたのですが、Webページでは以下のエラーが出てしまい、動作しません。
=====
XMLHttpRequest cannot load file:///xxxx/xxx/xxxx/...
0
票
1
回答
462
閲覧数
ページスタックを自作する方法
トップページをAとして
A → B → C
という遷移と
A → X → Y
という遷移があります。
それぞれはpushPage()とpopPage()で行き来できます。
今回、CからYに遷移させたいのですが、その際の戻る操作は以下のように遷移させたいのです。
しかしその方法がわかりません。
C → Y → X → A(TOP)
ページスタックを自作するなど方法はありますでしょうか?...
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";
...
1
票
1
回答
417
閲覧数
frameタグの中に、YouTubeのビデオIDが設定されているangular式を指定して動画再生したい
iframeタグの中に、YouTubeのビデオIDが設定されているangular式を指定して
動画再生したいのですが、可能でしょうか。
現状、直接的にビデオIDを指定する方法が分からなかったので、
仕方なくSelectBoxを使っております。
(SelectBoxでビデオIDを選択すると、選択したIDの動画が再生出来るようになっています)
※以下参照
これを、SelectBoxを使用せずに、...
0
票
1
回答
635
閲覧数
Onsen UIを使った背景の画像
Onsen UIを使用して背景に画像を張りたいのですが
HTMLのCSSを使用して
body { background-image : url("画像");
font-family: 'Open Sans', sans-serif;
}
としてるのですが変わりません
Onsen UIのスタイルシートを使用し変更した方が良いでしょうか?
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
票
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
回答
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
回答
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
票
3
回答
939
閲覧数
ons-switchの使い方
Monaca Cloud IDEにてプログラミングの勉強をしています。
本題ですが、ons-switchのメソッド isCheckedを使ってPタグの内容を変更しようと”monaca公式ガイドブック HTML5ハイブリッドアプリ開発”を参考にやってみましたが、上手くいきませんでした。(ons-switchは表示されていますが、Pタグの内容が変更できていません)
ご教授宜しくお願いします。
&...
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
票
0
回答
281
閲覧数
Android端末でOnsenUI2.0.0のアプリ実行時にエラーが出てしまう
こんにちは、先日リリースされたOnsenUI2.0.0(正式版)を使用してアプリを作成したいと考えています。
しかし、OnsenUI2.0.0を使用するとAndroid端末でエラーメッセージが表示されてしまいます。
エラー内容が「onsenui.min.js」のpromiseがcatchされていないということはわかりましたが、どう対処してよいか分かりません。
...
1
票
1
回答
867
閲覧数
OnsenUI2.0で、タブ表示(ons-tabbar)した時のAngularJSのコントローラのふるまいについて
OnsenUIを1系から2.0への移行を検討しています。
angularJSは1.5を使用しています。
下記のons-tabで設定している各ページにコントローラを適用しています。
OnsenUI 1系では、それぞれのタブに割り当てられたページを開くと、それに対応するコントローラのJavascriptが実行されていましたが、
OnsenUI 2.0では、最初のページを開くと、...
-1
票
1
回答
743
閲覧数
monaca「RSSリーダー」アプリに記事画像も表示したい。
「monaca」と「nifty mobile backend」を使って、RSSリーダーアプリを作成しています。
monacaのドキュメントにあるサンプルアプリ『RSSリーダー』を参考にして作っているのですが、記事元の画像(WordPressで言うところのアイキャッチ画像)も表示したいと思っています。
ドキュメントは「タイトル・日付・概要文」のみの取得・表示となっており、...
1
票
1
回答
557
閲覧数
InAppBrowserでカスタムヘッダを付加する方法
InAppBrowserで、
window.open('http://example.jp/', '_blank', 'location=yes');
などとする時、httpリクエストヘッダに
x-sample: abcd
などのカスタムヘッダを付加する方法は、何かありますでしょうか?
cordovaのバージョンは6.2です。
何卒、よろしくお願いいたします。
0
票
1
回答
228
閲覧数
monaca Onsen UI で setActiveCarouselItemIndex() エラーがでます。
monaca+onsen uiで、アプリの勉強をしております。
monaca は、「Onsen UI V2 Angular 1 Minimum」を選択し、新規プロジェクトを作成しました。
参考ページとして
「Onsen UIを使ってスワイプで切り替えられるタブを実装する」
http://cly7796.net/wp/javascript/to-implement-a-tab-to-be-...
1
票
0
回答
106
閲覧数
ons-pull-hookを使った際のTypeError: Cannot read property '0' of nullのエラーについて
ons-pull-hookを実装したページでTypeError: Cannot read property '0' of nullのエラーが出ます。
ons-pull-hookを実装したページからpushPageで画面遷移し、
popPageで元のページへ戻り、もう一度pushPageで画面遷移すると、下記のようなエラーが出ます。
いろいろ試し上記の原因に辿り着いた所存です。
...
0
票
1
回答
648
閲覧数
pushPageとpopPageで別のアニメーションを設定したい
こんにちは、MonacaでOnsenUIを使用してアプリを開発しています。
ons-navigatorのpushPageメソッドを使用して画面遷移を行っています。
その際にオブジェクトでアニメーションをfadeに指定しています。
遷移後の画面からpopPageメソッドを使用して前画面に遷移する際に別のアニメーションを指定したいです。
現在記述しているコードは以下となります。
<ons-...
0
票
1
回答
487
閲覧数
monacaでスワイプ操作ができません
monacaでアプリを作りたいと思い色々な動作をさせているのですが、スワイプ操作ができません。
コードに何か間違いなどありましたらお教え頂けると助かります。
よろしくお願いいたします。
※ヘッダーとボディを記載するとコードがおかしくなったため省きました
index.html
<meta charset="utf-8">
<meta name="viewport" ...
1
票
1
回答
426
閲覧数
<ons-tab>タブをタップした時のアニメーションを変更したい(カスタマイズ)
onsen uiで以下の機能を実装したいと考えています。
タブ切り替え時のアニメーションにons-navigatorの画面遷移時に設定できる"slide"のようなアニメーションでタブを切り替えたいと考えているのですが、ons-tabbarのオプションには"slide"が設定できないので他の方法で実装したいのですが、実装方法がわかりません。
上記実装をonsen ...
0
票
1
回答
4,443
閲覧数
読み込み完了の取得について
現在、Monacaを利用したスマホアプリ開発を行っており、いくつかのページで
読み込み完了した時点で走らせたいロジックがあるのですが
どうやって取得するのかわかりません。
今までこの手は、$(window).load(function(){} で大体なんとかなりましたが
今回は ons-navigator にある ons-page 内の処理となり同じ手が使えないので
質問した次第です。
...
0
票
0
回答
1,044
閲覧数
objectタグで外部サイトを埋め込んだとき、iOSではスクロールができない
現在、Monacaを利用したスマホアプリ開発行っており、ページのいくつかは
アプリ内で外部サイトを閲覧できる必要があります。(外部ブラウザはNG)
その際、objectタグを利用して表示しておりますが
Androidだと正常に(スクロールしてページの一番最後まで)表示できるのですが
iPhoneだと最初に表示された以上の領域が表示できません。
途中で切れているので下へスクロールもできません。
...
0
票
1
回答
1,098
閲覧数
Monaca/Onsen UI でDBの内容でons-list-itemを生成しても、一番最後の物しか表示されない
MonacaでonsenUIのons-list内のons-list-itemをDBから取得したデータで複数生成しようと考えています。
下のように記述しているのですが、ons-list-itemがJavascriptのfor文の最後の周回で取得した物しか生成されません。
初心者でわからないことだらけなので、助言していただければ大変ありがたいです。
よろしくお願いします。
index.html
&...
0
票
0
回答
64
閲覧数
monaca/onsen-ui で一覧ページのデータを詳細ページで使いたい [重複]
現在Monaca/onsen-uiにてアプリ開発をしております。
一覧ページで取得したデータを詳細ページでも使いたいのですがうまくいかなくて困っております。
var app = ons.bootstrap();
app.controller('MyCtrl', ['$scope', '$http', '$q',
function($scope, $http, $q) {
$scope....
0
票
0
回答
1,158
閲覧数
Monaca/Onsen UI で jQuery での操作が出来ない場合がある
Onsen UIのタブバーテンプレートから開発を進めていますが
jQueryで要素にアクセスするのに困っています。
Monaca/Onsen UI/Angularjs 全て初心者で何を掲載するべきか分からないため
該当すると思われるコード箇所を記載致します。
他ページでは$(function () {〜による表示時のjQueryの実行もできています。
// Controller
...
0
票
1
回答
511
閲覧数
onsen-UIでの背景の変更
onsen-UIでのCSSで
.page__background {
background:url('../images/title_img.jpg') no-repeat;
background-size: auto 80%;
background-position: center;
}
このように背景を設定しているのですが、
この背景画像を変更するには、...
-1
票
1
回答
915
閲覧数
ons-tabbar-itemを使って外部サイトを開きたい
お世話になります。
ons-tabbar-itemのpage属性に外部サイトのURLを記述すると、アプリの中で開くため、
「戻る」などの操作ができなくなります。
そのため、タップした時に、アプリ内の専用ブラウザを開くか、スマートフォンのブラウザアプリを起動させて指定した外部サイトを開きたいと思っております。
どのように記述すればよいかご教授いただけませんでしょうか。
宜しくお願い致します。
0
票
1
回答
223
閲覧数
現在のページと関係ないprepopが呼び出される
CordovaとOnsen UIでアプリを開発しています。
親画面→詳細画面→子画面の構造になっており、詳細画面→親画面へ戻る場合のみに以下の処理を行いたいのですが、どのように実装すればよいでしょうか。
以下のコードは詳細画面のcontroller内に記載しています。
myNavigator.on('prepop', function(event) {
$interval.cancel(...
0
票
1
回答
404
閲覧数
レスポンシブなグリッドレイアウトの実現方法
こんにちは
Cordova+OnsenUIでリストを表示するアプリを作成しています。
現在はiPadでも上から下へ1列でリストを表示していますが、
iPadの(のように大きな画面の)場合は3列でリストを表示するなどレスポンシブなデザインにしたいと思っていますが、OnsenUIで実現可能でしょうか。
ons-colでは固定で列数を指定しているようなので一つのソースでは難しいかと思っています。
&...