Проблема jQuery с .data(), содержащим пробел в своем значении

Question

Много вопросов похоже на это, но я действительно не вижу, что я делаю неправильно.

Так я прохожу открытую самозагрузки модальности, которая имеет формы ниже:

<form> 
     VIN: <br> 
     <input type="text" id="updateVin" name="updateVin" value=""> 
     <br> 
     Description: <br> 
     <input type="text" id="updateDescription" name="updateDescription" value=""> 
     <br> 
     Color: <br> 
     <input type="text" id="updateColor" name="updateColor" value=""> 
     <br> 
     Model: <br> 
     <input type="text" id="updateModel" name="updateModel" value=""> 
     <br> 
     Area ID: <br> 
     <input type="text" id="updateAreaId" name="updateAreaId" value=""> 
     <br> 
     Geofence ID: <br> 
     <input type="text" id="updateGeofenceId" name="updateGeofenceId" value=""> 
     <br> 
     <button class="btn btn-warning" id="updateVehicle">Update</button> 
     &nbsp; 
     <button class="btn btn-danger" id="deleteVehicle"> 
     Delete 
     </button> 
    </form> 

Я хочу установить входные значения, чтобы быть чем-то различно для разных ссылок на это же модальный.

выполнить это так:

$(document).on("click", ".open-UpdateModal", function() { 
     var vin = $(this).data('vin'); 
     var description = $(this).data('description'); 
     var color = $(this).data('color'); 
     var model = $(this).data('model'); 
     var areaId = $(this).data('areaid'); 
     var geofenceId = $(this).data('geofenceid'); 
     $(".update #updateVin").val(vin); 
     $(".update #updateDescription").val(description); 
     $(".update #updateColor").val(color); 
     $(".update #updateModel").val(model); 
     $(".update #updateAreaId").val(areaId); 
     $(".update #updateGeofenceId").val(geofenceId); 
     $('h4.modal-title').text('Updating ' + vin + ':'); 
    }); 

Я получаю значение из данных таблицы, в одной из моих таблиц:

<td> 
    <a data-toggle="modal" href="#my_modal" class="open-UpdateModal" 
    data-deletevin=<%= vehicles[i].vin %> 
    data-vin=<%= vehicles[i].vin %> 
    data-description=<%= vehicles[i].description %> 
    data-color=<%= vehicles[i].color %> 
    data-model=<%= vehicles[i].model %> 
    data-areaid=<%= vehicles[i].areaId %> 
    data-geofenceid=<%= vehicles[i].geofenceId %>> 
    <%= vehicles[i].vin %> </a> 
</td> 

Это отлично работает! Помимо того факта, что, если, например, описание данных равно «Toyota Rav4», входное значение будет только «Тойота». Помимо этого, это работает отлично.

Это проблема с jQuery и пробелами? Или я делаю что-то неправильно?

Я попытался использовать $ (this) .attr ('data-description').

Answer 1

Просто добавьте кавычки значения:

<a data-toggle="modal" href="#my_modal" class="open-UpdateModal" 
data-deletevin="<%= vehicles[i].vin %>" 
data-vin="<%= vehicles[i].vin %>" 
data-description="<%= vehicles[i].description %>" 
data-color="<%= vehicles[i].color %>" 
data-model="<%= vehicles[i].model %>" 
data-areaid="<%= vehicles[i].areaId %>" 
data-geofenceid="<%= vehicles[i].geofenceId %>"> 
<%= vehicles[i].vin %> </a>