●やりたいこと
1.大分類・中分類・数値に任意の値を入力し設定ボタンで値を登録
例:大分類:a・中分類:b・数値1
大分類:a・中分類:b・数値2
大分類:a・中分類:c・数値3
を登録
2.大分類・中分類に上記1で登録した値を入力し全取得ボタンにて検索
例:大分類:a・中分類:b
を検索
3.上記2条件に該当する中分類の値,またその時の数値を全て配列形式にて表示
例:配列:b,1,2
と表示したいのですが、pc版chromeでは『ncaught TypeError: Cannot read property 'resolve' of undefined』とエラーになります。
また、ios版chromeでは配列:b,1までしか表示されません。
(後々配列結果を別関数で利用したいので、関数を分けています。)
●質問内容
下記copygetAll関数内のvalue関数の反復処理がすべて終了する前にsample関数が実行されている様子のためpromiseにて先にvalue関数の処理を終了させようと考えたのですが、考え方は間違っていますか?
また、何処を修正すれば良いのでしょうか?
稚拙な文章で申し訳ございませんが、ご教授お願いいたします。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width" /> </head> <body> <h3>1登録・更新</h3> <form action="#"> <p>大分類:<input type="text" value="" name="copy" id="newcopyvalue"/></p> <p>中分類:<input type="text" value="" name="copy" id="newcopyvalue2"/></p> <p>数値:<input type="number" id="price"/></p> <input type="button" value="設定" onclick="copysetValue()"/> <input type="button" value="全取得" onclick="copygetAll()"/> <h3>処理結果 </h3> <div id="result"></div><hr> </form> </body> <script> var db; var indexedDB = window.indexedDB || window.mozIndexedDB || window.msIndexedDB; if (indexedDB) { var openRequest = indexedDB.open("mydb", 1.0); openRequest.onupgradeneeded = function(event) { // データベースのバージョンに変更があった場合(初めての場合もここを通ります。) db = event.target.result; var store = db.createObjectStore("copymystore", { keyPath:"timeStamp",autoIncrement:true}); store.createIndex("copymyvalueIndex",["copymyvalue","copymyvalue2"],{unique:false,multiEntry:false}); } openRequest.onsuccess = function(event) { db = event.target.result; } } else { window.alert("このブラウザではIndexed DataBase API は使えません。"); } function copysetValue(event){ var timestamp = new Date().getTime(); var copyvalue = document.getElementById("newcopyvalue").value; var copyvalue2 = document.getElementById("newcopyvalue2").value; var price = document.getElementById("price").value; var transaction = db.transaction(["copymystore"], "readwrite"); var store = transaction.objectStore("copymystore"); var request = store.put({timeStamp:timestamp, copymyvalue:copyvalue, copymyvalue2:copyvalue2, price:price}); request.onsuccess = function (event) { timestamp = new Date().getTime(); document.getElementById("newcopyvalue").value = ""; document.getElementById("newcopyvalue2").value = ""; document.getElementById("price").value = ""; } } function copygetAll(event) { var result = document.getElementById("result"); result.innerHTML = ""; var copyvalue = document.getElementById("newcopyvalue").value; var copyvalue2 = document.getElementById("newcopyvalue2").value; var transaction = db.transaction(["copymystore"], "readwrite"); var store = transaction.objectStore("copymystore"); var index = store.index("copymyvalueIndex"); //count var countall; var request1 = index.count([copyvalue, copyvalue2] ,"next") request1.onsuccess = function count(event) { if(event.target.result == null) { return; } countall = event.target.result; } //value +count var numbers = new Array(); var graphtitle; var request2 = index.openCursor([copyvalue, copyvalue2] ,"next") ; request2.onsuccess = function value(event) { if(event.target.result == null) { return; } var cursor = event.target.result; var data = cursor.value; graphtitle = data.copymyvalue2; var number = data.price; numbers.push(number); /* result.innerHTML += "件数 :" + countall + " key:" + cursor.primaryKey +" value:" + data.copymyvalue + " value2:" + data.copymyvalue2 + " 数値:" + data.price + "<br>"; /* cursor.continue(); /* result.innerHTML += "配列表示"+ numbers +"@value関数"+"<br>"; */ } //配列(copymyvalue2、数値1、数値2...) var request3 = index.openCursor([copyvalue, copyvalue2] ,"next") ; request3.onsuccess = function sample(event){ numbers.unshift(graphtitle); result.innerHTML += "配列表示" + numbers +"@sample関数"+"<br>"; } var promise = promise.resolve(); promise .then(value(event)) .then(sample(event)); } </script> </html>
回答2件
あなたの回答
tips
プレビュー