All'inizio questo potrebbe sembrare come molte delle altre domande già poste riguardo a NaN in JavaScript, ma vi assicuro che non lo è.Perché questa funzione restituisce NaN?
ho questo pezzo di codice che converte afferra il valore da una casella di testo, e la converte in una data dopo aver fatto clic su un pulsante in un modulo:
var dateString = $('#itemAcquiredTxt').val(); //Would have a value of '2013-12-15'
var dateAcquired = new Date(dateString); //Invalid Date ?
La casella di testo itemAcquiredTxt avrebbe un valore di "2013 -12-15" (formato AAAA-MM-DD) tratto da una chiamata al database:
$('#itemAcquiredTxt').val(new Date(item.DateAcquired).toLocaleDateString());
Dopo aver creato il nuovo oggetto Date che mi dà "data non valida".
OK ... Quindi ho pensato di creare l'oggetto Date facendolo passare anno, mese e giorno come numeri - uno dei suoi altri costruttori.
var year = Number(dateString.split("-")[0]); //Returns NaN
var month = Number(dateString.split("-")[1]); //Returns NaN
var day = Number(dateString.split("-")[2]); //Returns NaN
var dateAcquired = new Date(year, month - 1, day); //InvalidDate
ho provato dividere la stringa nella data di testo da parte del cruscotto, e convertire la stringa in un numero utilizzando sia Numero e parseInt - ma entrambi mi ha dato una NaN. Ho ricontrollato i valori della stringa e nulla sembrava sbagliato: "2013", "12", "15" rispettivamente sugli elementi suddivisi.
ho detto a me stesso ... forse il mio codice è male, e l'ho provato sulla JSFiddle https://jsfiddle.net/jrxg40js/
Ma come si può vedere qui, dopo aver piazzato una data nel testo e premendo il pulsante, funziona!
Heres il relativo codice HTML
<table id="inputTable">
<tr>
<td><span><strong>Name:</strong></span></td>
<td><input id="itemNameTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Category:</strong></span></td>
<td>
<select id="categorySelect" ng-model="selectedCategory" ng-change="changeSubCategoryList(selectedCategory)" ng-options="cat as cat.CategoryName for cat in categoriesObj track by cat.CategoryID">
<option value="">---Please Select One---</option>
</select>
</td>
</tr>
<tr ng-show="hasSubCat">
<td><span><strong>Sub Category</strong></span></td>
<td>
<select id="subCategorySelect">
<option value="">---Please Select One---</option>
<option ng-repeat="sub in subCategoryObj" value="{{sub.SubCatID}}">{{sub.SubCatName}}</option>
</select>
</td>
</tr>
<tr>
<td><span><strong>Description:</strong></span></td>
<td><input id="itemDescriptionTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Serial Number:</strong></span></td>
<td><input id="itemSerialNumberTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Year:</strong></span></td>
<td><input id="itemYearTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Initial Cost:</strong></span></td>
<td><input id="itemValueTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Department:</strong></span></td>
<td>
<select id="departmentSelect">
<option value="">---Please Select One---</option>
<option ng-repeat="dep in departmentsObj" value="{{dep.RoleID}}">{{dep.RoleDescription}}</option>
</select>
</td>
</tr>
<tr>
<td><span><strong>Campus:</strong></span></td>
<td>
<select id="campusSelect" ng-model="selectedCampus" ng-change="changeBuildingList(selectedCampus)" ng-options="campus as campus.CampusDescription for campus in campusesObj track by campus.CampusID">
<option value="">---Please Select One---</option>
</select>
</td>
</tr>
<tr>
<td><span><strong>Building:</strong></span></td>
<td>
<select id="buildingSelect">
<option value=""> </option>
<option ng-repeat="building in buildingsObj" value="{{building.BuildingID}}">{{building.BuildingDescription}}</option>
</select>
</td>
</tr>
<tr>
<td><span><strong>Date Acquired:</strong></span></td>
<td><input id="itemAcquiredTxt" type="text" value="" /></td>
</tr>
<tr>
<td><span><strong>Notes:</strong></span></td>
<td>
<textarea id="noteTxt"></textarea>
</td>
</tr>
</table>
AngularJS pertinenti funzione utilizzata per aggiornare l'articolo con nuovi dati digitati dall'utente - la funzione viene chiamata quando un utente preme un pulsante di conferma:
$scope.editItem = function() {
var dateString = $('#itemAcquiredTxt').val();
dateAcquired = new Date(dateString);
var invItem = {
ItemID: $('#itemID').val(),
ItemName: $('#itemNameTxt').val().trim(),
CategoryID: $('#categorySelect').find(":selected").val(),
SubCategoryID: $('#subCategorySelect').find(":selected").val(),
Description: $('#itemDescriptionTxt').val().trim(),
SerialNumber: $('#itemSerialNumberTxt').val().trim(),
Year: $('#itemYearTxt').val().trim(),
DateAcquired: dateAcquired,
Value: $('#itemValueTxt').val().trim(),
RoleID: $('#departmentSelect').find(":selected").val(),
Barcode: null,
Notes: $('#noteTxt').val().trim(),
Deleted: null,
AddedBy: null,
DateAdded: null,
ModifiedBy: null, //Added by server
DateModified: null,
DeletedBy: '',
DateDeleted: null,
CampusID: $('#campusSelect').find(":selected").val(),
BuildingID: $('#buildingSelect').find(":selected").val(),
RoomID: null
};
$http.put("api/inventory/", invItem).success(function (data, status, headers, config) {
inventoryData.retrieveData(); //On success, refresh zeh data
}).error(function (data, status, headers, config) {
console.log(data);
});
$("#dialogForm").dialog("close");
Perché il mio codice restituisce NaN sul mio ambiente di lavoro (debug di Visual Studio 2015 su IE11) quando altri siti, come JSFiddle, restituiscono ciò che mi aspetto?
Quanto sei sicuro che la stringa di data sia esattamente ciò che pensi che sia? Hai usato 'console.log()' per scaricarlo nella console prima di usarlo per creare una data o controllare tramite il debugger del browser?Deve essere il caso che qualcosa non stia accadendo nel modo in cui tu pensi che sia. Verifica tutte le tue ipotesi! – Pointy
Ad esempio: sei sicuro che c'è un solo "" con quell'ID sulla pagina? – Pointy
Piuttosto sicuro. Controllato sia il browser debugger che console.log. E sì, c'è un solo input con quell'ID. – Cuauhtemoc