on; 1: on; length: 2; prevObject: [object Object]; jquery: 3.1.0; constructor: function (a,b){return new r.fn.init(a,b)}; toArray: function (){return f.call(this)}; get: function (a){return null!=a?a<0?this[a+this.length]:this[a]:f.call(this)}; pushStack: function などと続いている

3: jQueryでチェックボックスのチェック済みの値のみを取得 - MasKのpermission denied.

on,onと表示される

解決

ion-checkboxではなくてinput style="checkbox" としたら洗濯した値がvalue=""の中身となった。

tocheck

Ionic/AngularJS checkbox and ng-repeat from API - Stack Overflow

javascript - How to bind to list of checkbox values with AngularJS? - Stack Overflow

【jQuery】チェックされたチェックボックスを取得する - Qiita

ちょいちょいわからなくなるcheckbox, radio, selectboxの値の取り方 - Qiita

メモ：

jQueryは値の取得は先頭のものだけが対象になるのが普通で、 .val()もそう。

全部取るために、 .map()でループします。

1
<form id="my-form">

2
  <input type="checkbox" name="my-checkbox" value="A" />

3
  <input type="checkbox" name="my-checkbox" value="B" checked />

4
  <input type="checkbox" name="my-checkbox" value="C" checked />

5
</form>

1
var $checked = $('#my-form [name=my-checkbox]:checked');

2
var valList = $checked.map(function(index, el) { return $(this).val(); });

3
console.log(valList);  // => ["B", "C"]

複数あるかもなので、値も配列に詰めてます。

あ、 .map()の使い方は解説しないので、わからない人は探してみてくださいね。

jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com

var checkedSeasons = [];
$('[name="seasons"]:checked').each(function(){
  checkedSeasons.push($(this).val());
});http://codenote.net/javascript/jquery/2250.html

[jQuery] チェック済みの checkbox の値を取得して配列へ格納する方法 | CodeNote.net

フォームの中でない場合：

taneppa.net

console.log

アプトプットが[object Object]になってしまうときの対処除法

How can I display a JavaScript object? - Stack Overflow

2016-08-17

ionicでフッターを二つ作りたいとき

ionic ハイブリッドアプリ

成功：

bar-subfooter

bar-footer

の使い分け

stackoverflow.com

失敗：

divをion-contentに入れる

footer-barにdivやrowを二つ入れる

サブフッターをfloat、clearする

<br>を使う

2016-08-12

rangeslider.jsをカスタマイズする

ハイブリッドアプリ Javascriptライブラリ ionic

使うもの

rangeslider.js.org

カスタマイズ例を見てもCSSが当たらなかった

原因

・ブラウザでCSS変数の使用ができなかった

・SCSS, SASSフォーマットからうまく変換できなかった

・rangeslider.cssを読み込めてなかった

・rangesliderをJavaScriptでinitializeできていなかった

　Building out your app - Ionic Framework

　AngularJSのControllerとScopeの基礎を学ぼう | HTML5Experts.jp

解決策

ブラウザのInspectorでチェックしながらCSSで上書き

見たけど応用できなかったもの

codepen.io

2016-08-11

ログスケールの円形ナンバーピッカーを作る

Tween ハイブリッドアプリ Javascriptライブラリ ionic

材料：

注意：

年間１万円程度の年会費がダウンロードに必要 GreenSock | ThrowPropsPlugin

チュートリアル

実装した後

ドラッグ中、ドラッグした後の地点でのポジションの値を返す：

Draggable End Position

目もりをログスケールにする：

他の材料：

dougTesting.net : Home

Edit fiddle - JSFiddle

Spinning wheel javascript · GitHub

GitHub - zarocknz/javascript-winwheel: Create spinning prize wheels on HTML canvas with Winwheel.js

2016-08-08

ionic pushでプッシュ通知を実装する 2: full push

概要：

docs.ionic.io

この後に

docs.ionic.io

エラー：

Undefined "init" function for notification push · Issue #91 · driftyco/ionic-platform-web-client · GitHub

解決：

実機でしかテストできない。

実機を使う(Android)

BUILD FAILED

Total time: 5.096 secs
Error: /Users/HOkaniwa/ionic_projects/bitCake-prototype/platforms/android/gradlew: Command failed with exit code 1 Error output:
FAILURE: Build failed with an exception.

* What went wrong:
A problem occurred configuring root project 'android'.
> Could not resolve all dependencies for configuration ':_debugCompile'.
> Could not find any version that matches com.google.android.gms:play-services-gcm:9.0.2+.
Versions that do not match:
8.3.0
8.1.0
7.8.0
Searched in the following locations:----- ファイルリスト

* Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

------

問題：実機がダメなのではなくてionic build androidが出来ていない。

ionic platform add android　はすでにしてある。

解決：Android Support Library and Android support Repository をインストール

Android StudioでAndroid SDK Managerを開いて、ライブラリをアップデートする - Qiita

結果：

Note: /Users/local/ionic_projects/bitCake-prototype/platforms/android/src/org/apache/cordova/splashscreen/SplashScreen.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.

問題：ionic run androidをすると device not found

emulatorでしかエミュレートできない。

解決１：adb を使って携帯を認識する

adbをMacのターミナルで使えるようにする - Qiita

解決２：端末を指定してionic runする

解決３：再起動、Macに接続、Androidを開く、「OK」する

ーー

問題：実機でログを見れない

解決：adb logcat

問題：長すぎるログ

テキストファイルにする：

How to pull a Logcat file from your android device - YouTube

他の方法：

android - Get devices token? - Stack Overflow

他のチュートリアル

The following docs demonstrate the different capabilities of the Ionic.Push service that you get with the Ionic platform web client.

docs.ionic.io

iOS, Android どっちのtoken か

How to identify if device token is for android or iOS? - Stack Overflow

➜ pushTest ionic plugin add phonegap-plugin-push --variable SENDER_ID=bitcake01
Updated the hooks directory to have execute permissions
Fetching plugin "phonegap-plugin-push" via npm
Installing "phonegap-plugin-push" for android
Installing "phonegap-plugin-push" for ios
Plugin doesn't support this project's cordova-ios version. cordova-ios: 3.8.0, failed version requirement: >=4.1.0
Skipping 'phonegap-plugin-push' for ios
Using this version of Cordova with older version of cordova-ios is being deprecated. Consider upgrading to cordova-ios@4.0.0 or newer.
cp: no such file or directory: /Users/local/ionic_projects/pushTest/resources/ios/icon/icon-40@3x.png

Saving plugin to package.json file

＝＞？

ーーーー

問題：

Ionic Push: GCM_INVALID_REGISTRATION

logを見る

ionic run android -l -c -s

github.com

解決：

device token をlogから取ってくる

device token は device id (１５文字の数字)ではない！

結果：curl コマンド

curl -X POST -H "Authorization: Bearer API_KEY" -H "Content-Type: application/json" -d '{
"tokens": ["DEVICE_TOKEN"],
"profile": "profile01",
"notification": {
"message": "This is my demo push!"
}
}' "https://api.ionic.io/push/notifications"