2017-06-21 13 views
-1

JSONのオブジェクトの数私はオブジェクトの7番目の番号を置き換えたいどのように置き換えることができますか?

var mainData = []; 
 
getData(); 
 
\t function getData() { 
 
\t var data = JSON.parse(localStorage.getItem('user')); 
 
\t \t 
 
     var html = ""; 
 
     for (var i = 0; i < data.length; i++){ 
 
\t  html +="<tr>"+ 
 
       "<td>"+ (i+1) + "</td>"+ 
 
       "<td>"+ data[i].name + "</td>"+ 
 
       "<td>"+ data[i].number + "</td>"+ 
 
       "<td>"+ data[i].city + "</td>"+ 
 
       "<td>"+ data[i].hobby + "</td>"+ 
 
       "<td>"+ data[i].birthdate + "</td>"+"<td><button data-arrayIndex='"+ i +"' onclick='editData(this)'>Edit</button><button data-arrayIndex='"+ i +"' onclick='deleteData()'>Delete</button></td>"+"</tr>"; 
 
\t } 
 
\t $("#tableHtml").html(html); 
 
} 
 
function deleteData(thisEle){ 
 
    \t var arrayIndex = $(thisEle).attr("data-arrayIndex"); 
 
    \t console.log(arrayIndex); 
 
} 
 

 

 

 

 
function editData(thisEle){ 
 
\t var arrayIndex = $(thisEle).attr("data-arrayIndex"); 
 
\t var data = JSON.parse(localStorage.getItem('user')); 
 
\t var name = data[arrayIndex]['name']; 
 
\t var number = data[arrayIndex]['number']; 
 
\t var city = data[arrayIndex]['city']; 
 
\t var hobby = data[arrayIndex]['hobby']; 
 
\t var birthdate = data[arrayIndex]['birthdate']; 
 

 
\t $("#hiddenele").val(arrayIndex); 
 
\t $("#name").val(name); 
 
\t $("#number").val(number); 
 
\t $("#city").val(city); 
 
\t $("#birthdate").val(birthdate); 
 
\t $('#addValue').css('display', 'none'); 
 
\t $('#updateValue').css('display', 'block'); 
 
\t var hobby ; 
 
\t \t $(document).ready(function(){ 
 
     \t \t var d = data[arrayIndex].hobby; 
 
     \t \t if(d == 'cricket, chess, hockey'){ 
 
     \t \t \t \t $('.hobby').prop('checked', true); \t \t 
 
     \t \t }else if(d == 'cricket, chess'){ 
 
     \t \t \t $('.hobby').prop('checked', false); \t \t 
 
     \t \t \t $('#cricket').prop('checked', true); 
 
     \t \t \t $('#chess').prop('checked', true); 
 
     \t \t }else if(d == 'chess, hockey'){ 
 
     \t \t \t $('.hobby').prop('checked', false); 
 
     \t \t \t \t $('#hockey').prop('checked', true); 
 
     \t \t \t \t $('#chess').prop('checked', true); 
 
     \t \t }else if(d == 'cricket, hockey'){ 
 
     \t \t \t $('.hobby').prop('checked', false); \t \t 
 
     \t \t \t \t $('#hockey').prop('checked', true); 
 
     \t \t \t \t $('#cricket').prop('checked', true); 
 
     \t \t }else if(d == 'cricket'){ 
 
     \t \t \t $('.hobby').prop('checked', false); \t \t 
 
     \t \t \t \t $('#cricket').prop('checked', true); 
 
     \t \t }else if(d == 'chess'){ 
 

 
     \t \t \t $('.hobby').prop('checked', false); \t \t 
 
     \t \t \t $('#chess').prop('checked', true); 
 
     \t \t }else if(d == 'hockey'){ 
 
     \t \t \t $('.hobby').prop('checked', false); \t \t 
 
     \t \t \t $('#hockey').prop('checked', true); 
 
     \t \t } else { 
 
     \t \t \t console.log('data not valid'); 
 
     \t \t } 
 
}); 
 
} 
 

 

 
function updateData(){ 
 
var arrayIndex = $("#hiddenele").val(); 
 
console.log(arrayIndex); 
 
var name = $("#name").val(); 
 
     var number = $("#number").val(); 
 
\t \t var hobby ; 
 
\t \t $(document).ready(function(){ 
 
      var a =[]; 
 
      $.each($("input[name='sport']:checked"), function(){    
 
       a.push($(this).val()); 
 
      }); 
 
      hobby = a.join(", "); 
 
     \t }); 
 
     var city = $("#city").val(); 
 
     var birthdate = $("#birthdate").val(); 
 
     \t if(name == '' || number == '' || city == '' || birthdate == '' || hobby == ''){ 
 
\t alert ('Enter Valid Credentials'); 
 
\t return false; 
 
} else { 
 
var contacts = { 
 
\t \t \t \t 'name' : name, 
 
\t \t \t \t 'number' :number, 
 
\t \t \t \t 'city' : city, 
 
\t \t \t \t 'hobby' : hobby, 
 
\t \t \t \t 'birthdate' : birthdate 
 
\t \t \t } 
 
var d = []; 
 
d.push(contacts); 
 
var a = localStorage.setItem('user', JSON.stringify(d[arrayIndex])); 
 
console.log(d); 
 
getData(); 
 
} \t 
 

 

 

 

 

 
} 
 

 

 
function addData(){ 
 
\t  var name = $("#name").val(); 
 
     var number = $("#number").val(); 
 
\t \t var hobby ; 
 
\t \t $(document).ready(function(){ 
 
      var a =[]; 
 
      $.each($("input[name='sport']:checked"), function(){    
 
       a.push($(this).val()); 
 
      }); 
 
      hobby = a.join(", "); 
 
     \t }); 
 
     var city = $("#city").val(); 
 
     var birthdate = $("#birthdate").val(); 
 
     \t if(name == '' || number == '' || city == '' || birthdate == '' || hobby == ''){ 
 
\t alert ('Enter Valid Credentials'); 
 
\t return false; 
 
} else { 
 
var contacts = { 
 
\t \t \t \t 'name' : name, 
 
\t \t \t \t 'number' :number, 
 
\t \t \t \t 'city' : city, 
 
\t \t \t \t 'hobby' : hobby, 
 
\t \t \t \t 'birthdate' : birthdate 
 
\t \t \t } 
 
mainData.push(contacts); 
 
var a = localStorage.setItem('user', JSON.stringify(mainData)); 
 
var obj = JSON.parse(localStorage.user); 
 
console.log(obj); 
 
getData(); 
 
} 
 
};
\t <title>CRUD App</title> 
 
    \t <script src="jquery.min.js"></script> 
 
    \t <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> 
 
    <link rel=stylesheet href="style.css"> 
 
    <style> 
 
    table { 
 
     font-family: arial, sans-serif; 
 
     border-collapse: collapse; 
 
     width: 100%; 
 
    } 
 

 
    td, th { 
 
     border: 1px solid #dddddd; 
 
     text-align: left; 
 
     padding: 8px; 
 
    } 
 

 
    tr:nth-child(even) { 
 
     background-color: #dddddd; 
 
    } 
 

 
    </style> 
 

 

 

 
    </head> 
 
    <body> 
 

 
    <!-- <input type="button" id="addNew" value ="Add new Entry"> --> 
 
    <div class="container-fluid pull-left" style="width:25%;"> 
 
    <form name="myForm" action="" > 
 
    <br> 
 
    <legend>Add New Number</legend><br> 
 
    <label for="name"></label> 
 
    <input type="text" name="name" id="name" placeholder="Name Please"> 
 
    <br> 
 
    <label for="number"></label> 
 
    <input type="number" name="number" id="number" maxlength="10" placeholder="Mobile Number"> 
 
    <br> 
 
    <label for="city"></label> 
 
    <select id = "city" name = "city"> 
 
      <option value="" disabled selected>Please Select</option> 
 
      <option value="Ahmedabad">Ahmedabad</option> 
 
      <option value="rajkot">rajkot</option> 
 
      <option value="surat">Surat</option> 
 
    </select> 
 

 
    <br> 
 
    <div id="checkbox"> 
 
    <label for="hobby">Hobby:</label><br> 
 
    <input type="checkbox" class="hobby" name="sport" value="cricket" id="cricket">Cricket <br> 
 
    <input type="checkbox" class="hobby" name="sport" value="chess" id="chess">Chess <br> 
 
    <input type="checkbox" class="hobby" name="sport" value="hockey" id="hockey">Hockey <br> 
 
    </div><br> 
 
    <label for="birthday"></label> 
 
    <input type="date" id="birthdate" name="birtdate" placeholder=""><br> 
 
    <!-- submit And Reset --><br> 
 
    <input class="btn btn-default" id = "addValue" type="button" value = "Add" onclick = "addData()" style="display: block;"> 
 
    <input class="btn btn-default" id = "updateValue" type="button" value = "update" onclick = "updateData()" style="display: none;"> 
 
    <input class="btn btn-default" type="reset" value="reset"> 
 
    <input type="hidden" id="hiddenele" val=""> 
 
    </form> 
 
    </div> 
 
    <br> 
 
    <br> 
 
    <div class="table-responsive" style="width: 70%"> 
 
    <legend>List Of Persons</legend> 
 
    <div id = "tab"> 
 
      <table> 
 
       <tr> 
 
        <td>ID</td> 
 
        <td>Name</td> 
 
        <td>Number</td> 
 
        <td>city</td> 
 
        <td>hobby</td> 
 
        <td>birthdate</td> 
 
     \t \t \t \t \t  <td>actions</td> 
 
        
 
       </tr> 
 
       <tbody id="tableHtml" onload="getData()"> 
 
        
 
       </tbody> 
 
       </table> 
 
    </div> 
 
    <!-- <script src="validate.min.js"></script> --> 
 
    <!-- <script src="validate.js"></script> --> 
 
    <script type="text/javascript" src="script.js"></script> 
 

するvar A = JSON.parse(localStorage.getItem( 'ユーザ')) 未定義(7)オブジェクト、オブジェクト、オブジェクト、オブジェクト、オブジェクト、オブジェクト、オブジェクト]

"[{" 名前 ":" KV」、 "番号": "65464564"、 "都市": "アーメダバード"、 "趣味" "クリケット、チェス、ホッケー"、 "生年月日" : "2019-02-02" }、 {
"名": "KV"、 "数": "65464564"、 "都市": "アーメダバード"、 "趣味": "クリケット、チェス、ホッケー"、 "生年月日": "2019から02 -02" }、{
"名前": "KV"、 "番号": "65464564"、 "都市": "アーメダバード"、 "趣味" "クリケット、チェス、ホッケー"、 "生年月日": "2019年2月2日" }、{
"名前": "KV"、 "番号": "65464564"、 "都市": "アーメダバード"、 "趣味":」クリケット、チェス、ホッケー " "生年月日": "2019年2月2日" }、{
"名前": "KV"、 "番号": "65464564"、 "都市": "アーメダバード"、 "趣味": "クリケット、チェス、ホッケー"、 "生年月日": "2019年2月2日" }、{
"名前": "KV"、 "番号": "65464564"、 "都市":」アーメダバード " "趣味" "クリケット、チェス、ホッケー"、 "生年月日": "2019年2月2日" }、{
"名前": "KV"、 "番号":" 65464564 "、 " c ITY ":" アーメダバード " "趣味" "クリケット、チェス、ホッケー"、 "生年月日": "2019年2月2日" }]"

+1

'[6 ] = myNewObject' – evolutionxbox

+0

var d = []; d.push(連絡先)。 var a = localStorage.setItem( 'user'、JSON.stringify(d)); console.log(d); var b = JSON.parse(localStorage( 'user'、 'properties [arrayIndex]')); console.log(b); 私はこのコードのようにしようとしていますが、ローカルストレージオブジェクト全体が置き換えられます。 値を更新するために置き換えることができます。 –

+0

質問を更新してください。 – evolutionxbox

答えて

0
b[arrayIndex]["name"] = name;b[arrayIndex]["number"] = number;b[arrayIndex]["city"] = city;b[arrayIndex]["hobby"] = hobby;b[arrayIndex]["birthdate"] = birthdate;var a = localStorage.setItem('user', JSON.stringify(b)); 
+2

このコードは質問に答えるかもしれませんが、どのようにして問題が解決されたのか、および/または理由が解明されれば、回答の長期的価値は向上します。 – Badacadabra

0
try this one 
a[7].name = "jerry"; 
+0

私はCRUDアプリケーションを作成しようとしているので、私はユーザーのオブジェクト全体を置き換えたいです。特定のオブジェクトの更新と削除に失敗しました –

関連する問題