週の開閉時間を編集する（日中）

Question

私は週の営業時間（Daywise）に取り組んでいます。私はjquery.businessHoursプラグインが完全に私は正常にデータを挿入することができますjson形式で見つかりました。私はこのようなjson形式でデータを挿入しました。しかし営業時間と営業時間はビジネスワイドなので、ビジネスオーナーが営業時間を編集できる機能があります。

これはフィドルリンクをJSご覧ください： https://jsfiddle.net/wdpu6jbf/

私はので、私はデータベースに格納されているJSONデータを以下しまった、このコードで

$adminid = '135'; 
$res = $conn->query("select json_data_timing_hours from timing_hours where admin_id='$adminid'"); 
$row = mysqli_fetch_assoc($res); 
echo $row['json_data_timing_hours']; 

を試してみました：

ARRAY1が

[ 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    } 
] 

今、私の問題は、色と数字の四角形でフィールドを編集する方法です。私はこのページを編集要求で訪れると、データベースに保存されている色とデータに従って塗りつぶされています。すべてが非常に理解しにくいスクリプトから来ているからです。

例：Array1では、週5日、時間は09:00から18:00までです。データがArray2の方法で格納されている場合

ARRAY2

[ 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": true, 
    "timeFrom": "09:00", 
    "timeTill": "18:00" 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    }, 
    { 
    "isActive": false, 
    "timeFrom": null, 
    "timeTill": null 
    } 
] 

[編集要求月曜日と火曜日の色は淡緑色であり、他の色は、特定の時間に赤いされています。 あなたの側からコード全体ができない場合は、私に働かせるヒントを与えてください。他の情報が必要な場合は教えてください。 （私たちはその結果に応じて変更する必要があります）

営業時間JSリンク：https://cdnjs.cloudflare.com/ajax/libs/jquery.businessHours/1.0.1/jquery.businessHours.js

を開き、このリンク私はoperationTimeを変更する必要があり、defaultOperationTimeFrom & defaultOperationTimeTill変数を動的しかし、私はそれを考え出したことはできませんか。

EDIT： 私がのonblur使用して、あなたはすべての人が時間を編集した場合、時間のテキストボックスのための手段をのonblurイベントを追加し、カーソルを移動することができます

operationTime: [ 
       {}, 
       {}, 
       {}, 
       {}, 
       {}, 
       {isActive: false}, 
       {isActive: false} 
      ], 
      defaultOperationTimeFrom: '9:00', 
      defaultOperationTimeTill: '18:00', 

Answer 1

、上記のjsのこの特定の部分を変更する必要がありますあなたはデータベース内のフィールドを編集することができ、テキストボックスには一意のIDまたはクラスを使用する必要があります。

質問がある場合はお知らせください。