Question

我是firebase和JavaScript的新手。我试图从复杂对象数组中访问数据。

我需要访问每个记录的日期：'02 -01-2018'。我得到密钥但不知道如何访问这个日期。我已经共享了我的数据库并在屏幕截图中返回了值。

{
	"dailyPrices": {
		"01-50005": {
			"04-01-2018": {
				"brands": "",
				"editorID": "janeef@janeef.com",
				"name": "dddf",
				"phone": "",
				"place": "errr"
			},
			"09-01-2018": {
				"brandPriceList": [{
					"brandName": "DC",
					"rsp": "400",
					"stock": "21",
					"supplierChange": "hhhh",
					"supplierRegular": "",
					"wsp": "350"
				}, {
					"brandName": "Barti",
					"rsp": "385",
					"stock": "54",
					"supplierChange": "",
					"supplierRegular": "",
					"wsp": "d380"
				}],
				"brands": "",
				"editorID": "janeef@janeef.com",
				"name": "dddf",
				"orderRequirement": {
					"casualRequirements": "",
					"followUpDate": "",
					"followUpRemarks": "",
					"noOfBags": "",
					"prospectiveness": "",
					"scheduledOrderDate": "",
					"scheduledOrderRemarks": "",
					"urgentRequirementRemarks": "",
					"urgentRequirements": ""
				},
				"phone": "",
				"place": "errr"
			}
		}
	}
}

<input type="text" name="ordDetailTXT" id="ordDetailTXT" value="dailyPrice">

代码

function findOrderDetails(parentKey) 
{
   var returnArr = [];
      var fetchRecord = database.ref(parentKey);
        fetchRecord.on('value', function(snapshot) {
            var item = snapshot.val();
            item.key = snapshot.key; 
            returnArr.push(item);            
    });
}

function btnClickedOrdDetails(){
  var parentkey = ("#ordDetailTXT").val();
findOrderDetails(parentKey);
}

Answer 1

只需在firebase.js中添加您的fire-base凭据，以便相应地工作和创建数据库结构。我不能在这里分享基础证书。

here is the working gif

var returnArr = [];  
function LookForDates()
{
	findPrices();
	return false;
}

function findPrices(){
	
	returnArr = [];  
	var database = firebase.database();
	var strtDate = $('#strtDate').val().split('-');
	strtDate = strtDate[2] + '-' + strtDate[1] + '-' + strtDate[0];

	var endDate = $('#endDate').val().split('-');
	endDate = endDate[2] + '-' + endDate[1] + '-' + endDate[0]; 
	  
	  var fetchDeleted = database.ref('dailyPrices');
	  fetchDeleted.on('value', function(snapshot)
	  	{
		    snapshot.forEach(function(snapshot) {
		        var item = snapshot.val();
		        item.key = snapshot.key;
		        item.parentKey = snapshot.key;
		         snapshot.forEach(function(child) {
                    item.childKey = child.key;
                });
                if(item.childKey >= strtDate && item.childKey <= endDate)
		        {
		        	returnArr.push(item);
		        }
		    });
	  	});
	  createPricesTable(returnArr);
	}
	function createPricesTable(returnArr)
	{
		$('#DateList')
		    .find('option')
		    .remove()
		    .end()
		    .append('<option value="">Select a district</option>')
    		.val('whatever');
    		returnArr.forEach(function(child) {
                   $('#DateList').append('<option value="'+ child.childKey +'">'+ child.childKey +'</option>');
                });
    	}
    	function DateSelected(value){
    		//perform some functionality
    	}

<!DOCTYPE html>
<html>
<head>
    <title>Welcome to Maps Website</title>
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/css/bootstrap-select.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.bundle.min.js" integrity="sha384-3ziFidFTgxJXHMDttyPJKDuTlmxJlwbSkojudK/CkRqKDOmeSbN6KLrGdrBQnT2n" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/js/bootstrap-select.min.js"></script>
    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Roboto+Mono&subset=cyrillic">
    <script src="https://www.gstatic.com/firebasejs/4.8.1/firebase.js"></script>
  
</head>
<body>

	 <div class="container">
        <div class="row">
              
             <div class="col-sm-12" style="margin-top: 5px;">
        	 
                           <div class="col col-sm-6"> <input required="" class="form-control" type="date" id="strtDate" name="Date"></div>
                            <div class="col col-sm-6"><input required="" class="form-control" type="date" id="endDate" name="Date"></div>
                            <div class="col col-sm-5"></div>
                            <div class="col col-sm-5"><br />
                            <button type="submit" onclick="return LookForDates();" class="btn btn-primary">Submit</button></div>
             </div>
             <button type="submit" style="display: block-inline; float: right;" onclick="ratelistExport()" id="ratelistExportBtn" class="btn btn-primary">Export to Excel</button>
            <div class="col-sm-12" style="margin-top: 10px;">
            	<select name="DateList" onchange="DateSelected(value)" class="form-control" id="DateList" required></select>
            </div>
        </div>
    </div>
	<script type="text/javascript" src="JS/Firebase.js"></script>
    <script type="text/javascript" src="JS/JSFidlle.js"></script>
</body>
</html>

我需要帮助来操作从fire-base

1 个答案: