Variables 如何让HTML输入字段在留空时不发送字符串值-不发送任何内容

我有一个问题，想看看这个想法是否可行。我创建了一个项目跟踪器，个人可以在其中加载他们的项目信息（办公室、项目标题、状态、日期、分配给等）。这个表格很好用。我有另一个表单，更新表单，供个人根据项目进度更新其输入值（选择与加载项目表单相同：办公室、项目、标题、状态、日期、分配给等）。这个表格更新得很好。然而，我有一个问题，如果HTML字段留空，在更新表单HTML输入字段上，它将发送一个“null”值，该值将覆盖发布到未更新的帖子跟踪列表中的值。更新表单的目的是为个人提供可能需要更新的内容的可能选择列表，在本例中为所有内容

如果输入字段留空不覆盖当前发布的值，是否有方法不发送任何值？这是可能的还是我需要做一些不同的事情，比如为每个不同的区域/列更新一个单独的更新表单

我正在使用RESTAPI将这些值发布并更新到SharePoint

---编辑以包含脚本---

接近
单击此处移动

完整填写此表格以更新您的项目

办公室
项目名称
优先
开始日期
分配给
地位
请求者
更新
发布并跟踪您的项目

选择发布项目。打开项目后表单时，将鼠标悬停在输入字段上以获取其他说明
选择以更新任务。打开项目后表单时，将鼠标悬停在输入字段上以获取其他说明
接近
单击此处移动























提交
项目清单
选择要排序的表标题

/*添加到项目跟踪列表*/
var语境；
var-web；
var-Url；
var listItemEntity；
jQuery（文档）.ready（函数（）{
SP.SOD.executeFunc（'SP.js'，'SP.ClientContext'，FunctionReady）；
ItemSubmit（）；
$（“#qForm”）.draggable（）；
$（“#qFormClose”）。单击（函数（）{
$（“#qForm”）.fadeOut（）；
});
$（“#openForm”）。单击（函数（）{
$（“#qForm”）.fadeIn（）；
});
$（“#openUForm”）。单击（函数（）{
$（“#updateForm”）.fadeIn（）；
});
}); //关闭文件准备功能
var answer=document.getElementById（'comAnswer'）；
函数ItemSubmit（）{
$（“#udList”）。单击（函数（）{
美元（“#qForm”）。淡出（400）；
var officeValue=$（“#office”）.val（）；
var projectValue=$（“#项目”）.val（）；
var priorityValue=$（“#优先级”）.val（）；
var startDateValue=$（“#startDate”）.val（）；
var assignedValue=$（“#assigned”）.val（）；
var statusValue=$（“#status”）.val（）；
var requestorValue=$（“#requestor”）.val（）；
如果（this.value！=0）{
AddItemToList（listItemEntity、officeValue、projectValue、priorityValue、startDateValue、assignedValue、statusValue、requestorValue）；
}否则{
AddItemToList（listItemEntity、officeValue、projectValue、priorityValue、startDateValue、assignedValue、statusValue、requestorValue）；
}
$（'#qForm'）.children（'input'）.val（''）；
});
}
函数FunctionReady（）{
context=new SP.ClientContext.get_current（）；
web=context.get_web（）；
加载（web）；
executeQueryAsync（onRequestSuccess，onRequestFailure）；
}
函数onRequestSuccess（）{
Url=web.get_Url（）；
GetListItemEntity（Url）；
}
函数onRequestFailure（发送方，参数）{
警报（“发生错误：+args.get_message（））；
}
函数GetListItemEntity（webUrl）{
var queryUrl=webUrl+“/_api/lists/getbytitle（'ProjectTracker'）？$select=ListItemEntityTypeFullName”；
$.ajax({
url:queryUrl，
方法：“获取”，
标题：{
“接受”：“application/json；odata=verbose”
},
成功：独一无二的成功，
错误：OneTityFailure
});
}
功能唯一性成功（数据）{
listItemEntity=data.d.ListItemEntityTypeFullName；
}
函数onEntityFailure（err）{
警报（错误状态文本）；
}
函数附加项列表（r、officeValue、projectValue、priorityValue、startDateValue、assignedValue、statusValue、requestorValue）{
试一试{
var queryUrl=Url+“/_api/list/GetByTitle（'ProjectTracker'）/items？”；
$.ajax({
url:queryUrl，
类型：“POST”，
contentType:“application/json；odata=verbose”，
数据：JSON.stringify({
“\u元数据”：{
“类型”：r
},
“Office”：officeValue，
“ProjectTitle”：projectValue，
“优先级”：priorityValue，
“StartDate”：startDateValue，
“AssignedTo”：assignedValue，
“状态”：状态值，
“请求者”：请求者值
}),
标题：{
“接受”：“application/json；odata=verbose”，
“X-RequestDigest”：$（“#u-RequestDigest”）.val（）
},
成功：OnQuerySuces，
错误：onQueryFailure
});
}捕获（ex）{
警报（“异常”+ex.message）；
}
}
函数onquerysuces（）{
jQuery（“#success”）.fadeIn（）；
}
函数onQueryFailure（错误）{
警报（JSON.stringify（错误））；
}
jQuery（文档）.ready（函数（）{
////项目跟踪表脚本
var requestUri=_spPageContextInfo.webAbsoluteUrl+“/_api/web/list/getbytitle（'ProjectTracker'）/items”；
$.ajax({
url:requestUri，
键入：“获取”，
<div id="container">
   <!-- --------------- code to update a list item ------------- -->
   <div id="updateForm">
      <div id="UpdateClose" style='text-align: left; float: right; margin-right: 10px; cursor: pointer;'>Close</div>
      <div style='margin: 0 auto; width: 100%; padding-top: 5px; padding-bottom: 5px; color: white; margin-top: 40px; margin-bottom: 10px; background-color: orange;'>
         <p>Click here to move</p>
      </div>
      <p>Fill out this form completely to update your item.</p>
      <input placeholder="Item ID" type="text" id="itemID">
      <table>
         <tr>
            <td>Office</td>
            <td><input type="text" id="uOffice" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Project Title</td>
            <td><input type="text" id="uProjectTitle" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Priority</td>
            <td><input type="text" id="uPriority" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Start Date</td>
            <td><input type="text" id="uStartDate" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Assigned To</td>
            <td><input type="text" id="uAssignedTo" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Status</td>
            <td><input type="text" id="uStatus" style="width: 200px"></td>
         </tr>
         <tr>
            <td>Requestor</td>
            <td><input type="text" id="uRequestor" style="width: 200px"></td>
         </tr>
      </table>
      <button id="UpdateListItem">UPDATE</button>
   </div>
   <div id="introTxt">
      <p>Post and Track your Projects</p>
      <p id='openForm'><img class='qIcon' src="https://intelshare.intelink.gov/sites/dcsa/ep/epMainFiles/Project_Tracker/graphics/google-docs.svg" alt="logo" style="width: 100px; position: relative; top: 0px; margin-right: 10px; cursor: pointer; "><span style='color: blue; cursor: pointer; position: relative; top: 20px; font-weight: bold;' >Select to post a project. When the post project form opens, hover over the input fields for additional instructions.</span></p>
      <p id='openUForm'><img class='qIcon' src="https://intelshare.intelink.gov/sites/dcsa/ep/epMainFiles/Project_Tracker/graphics/google-docs.svg" alt="logo" style="width: 100px; position: relative; top: 0px; margin-right: 10px; cursor: pointer; "><span style='color: black; cursor: pointer; position: relative; top: 20px; font-weight: bold;' >Select to update a task. When the post project form opens, hover over the input fields for additional instructions.</span></p>
   </div>
   <div id="qForm" style='width: 250px; height: auto; padding: 10px; position: absolute; z-index: 10; background-color: white; border: 1px solid grey; text-align:center; cursor: all-scroll; display: none;'>
      <div id="qFormClose" style='text-align: left; float: right; margin-right: 10px; cursor: pointer;'>Close</div>
      <div style='margin: 0 auto; width: 100%; padding-top: 5px; padding-bottom: 5px; color: white; margin-top: 40px; margin-bottom: 10px; background-color: orange;'>
         <p>Click here to move</p>
      </div>
      <input type="text" placeholder="Enter Your Office" name="Office" id="office" title='Enter in your office' required> <br><br>
      <input type="text" placeholder="Enter a Project Name" name="Project Name" id="project" title='Enter in a project name' required> <br><br>
      <input type="text" placeholder="Priority" name="url" id="priority" title='Enter in project priority'> <br><br>
      <input type="text" placeholder="Project Start Date" name="Start Date" id="startDate" title='Enter in project start date'> <br><br>
      <input type="text" placeholder="Assigned to" name="Assigned" id="assigned" title='Project assigned to'> <br><br>
      <input type="text" placeholder="Status" name="Status" id="status" title='Project status'> <br><br>
      <input type="text" placeholder="Requestor" name="Requestor" id="requestor" title='Project requestor'> <br><br><br>
      <div id="udList" style='cursor: pointer';>Submit</div>
   </div>
   <div class="row vertical-padding"></div>
   <!--Close of vertical padding-->
   <div id="leftCol" class="grid_12">
      <input id="myInput" type="text" placeholder="To find a specific task, enter either the office name, individual's name, or by task ID...">
      <h2 style='color:blue; marigin: 0 auto; text-align: center; font-weight: bold;'>Project List</h2>
      <p>Select table header to sort.</p>
      <div id="CustomerPanel">
         <table id='tableCars' style="width: 100%;" border="1 px">
            <tr>
               <td>
                  <div id="carsGrid" style="width: 100%"></div>
               </td>
            </tr>
         </table>
      </div>
   </div>
   <!--Close of grid-->
</div>
<!--Close container-->



/*Add to Project Tracker List*/
var context;
var web;
var Url;
var listItemEntity;

jQuery(document).ready(function() {
  SP.SOD.executeFunc('sp.js', 'SP.ClientContext', FunctionReady);
  ItemSubmit();


  $("#qForm").draggable();

  $("#qFormClose").click(function() {
    $("#qForm").fadeOut();

  });

  $("#openForm").click(function() {
    $("#qForm").fadeIn();

  });

  $("#openUForm").click(function() {
    $("#updateForm").fadeIn();
  });

}); //Close of document ready function

var answer = document.getElementById('comAnswer');

function ItemSubmit() {
  $("#udList").click(function() {
    $("#qForm").fadeOut(400);


    var officeValue = $("#office").val();
    var projectValue = $("#project").val();
    var priorityValue = $("#priority").val();
    var startDateValue = $("#startDate").val();
    var assignedValue = $("#assigned").val();
    var statusValue = $("#status").val();
    var requestorValue = $("#requestor").val();

    if (this.value != 0) {
      AddItemToList(listItemEntity, officeValue, projectValue, priorityValue, startDateValue, assignedValue, statusValue, requestorValue);
    } else {

      AddItemToList(listItemEntity, officeValue, projectValue, priorityValue, startDateValue, assignedValue, statusValue, requestorValue);

    }

    $('#qForm').children('input').val('');



  });
}

function FunctionReady() {
  context = new SP.ClientContext.get_current();
  web = context.get_web();
  context.load(web);
  context.executeQueryAsync(onRequestSuccess, onRequestFailure);
}

function onRequestSuccess() {
  Url = web.get_url();
  GetListItemEntity(Url);
}

function onRequestFailure(sender, args) {
  alert("Error Occured:" + args.get_message());
}

function GetListItemEntity(webUrl) {
  var queryUrl = webUrl + "/_api/lists/getbytitle('ProjectTracker')?$select=ListItemEntityTypeFullName";
  $.ajax({
    url: queryUrl,
    method: "GET",
    headers: {
      "Accept": "application/json;odata=verbose"
    },
    success: onEntitySuccess,
    error: onEntityFailure
  });
}


function onEntitySuccess(data) {
  listItemEntity = data.d.ListItemEntityTypeFullName;
}

function onEntityFailure(err) {
  alert(err.statusText);
}

function AddItemToList(r, officeValue, projectValue, priorityValue, startDateValue, assignedValue, statusValue, requestorValue) {

  try {

    var queryUrl = Url + "/_api/lists/GetByTitle('ProjectTracker')/items?";

    $.ajax({
      url: queryUrl,
      type: "POST",
      contentType: "application/json;odata=verbose",
      data: JSON.stringify({
        '__metadata': {
          'type': r
        },

        'Office': officeValue,
        'ProjectTitle': projectValue,
        'Priority': priorityValue,
        'StartDate': startDateValue,
        'AssignedTo': assignedValue,
        'Status': statusValue,
        'Requestor': requestorValue
      }),
      headers: {
        "accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val()
      },
      success: onQuerySucess,
      error: onQueryFailure
    });
  } catch (ex) {
    alert("Exception" + ex.message);
  }
}

function onQuerySucess() {
  jQuery("#success").fadeIn();

}

function onQueryFailure(error) {
  alert(JSON.stringify(error));
}


jQuery(document).ready(function() {

  ////Project Tracker Table script
  var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('ProjectTracker')/items";
  $.ajax({
    url: requestUri,
    type: "GET",
    headers: {
      "accept": "application/json; odata=verbose"
    },
    success: onSuccess,
    error: onError
  });



  function onSuccess(data) {
    var objItems = data.d.results;
    var tableContent = '<table id="projectTable" style="width:100%" border="1 px"><thead><th>ID</th>' + '<th>Office</th>' + '<th>Project_Title</th>' + '<th>Project_Priority</th>' + '<th>Project_Date</th>' + '<th>Assigned_To</th>' + '<th>Project_Status</th>' + '<th>Requestor</th>' + '</thead><tbody>';


    for (var i = 0; i < objItems.length; i++) {
      tableContent += '<tr class="sortTable">';
      tableContent += '<td>' + objItems[i].ID + '</td>';
      tableContent += '<td>' + objItems[i].Office + '</td>';
      tableContent += '<td>' + objItems[i].ProjectTitle + '</td>';
      tableContent += '<td>' + objItems[i].Priority + '</td>';
      tableContent += '<td>' + objItems[i].StartDate + '</td>';
      tableContent += '<td>' + objItems[i].AssignedTo + '</td>';
      tableContent += '<td>' + objItems[i].Status + '</td>';
      tableContent += '<td>' + objItems[i].Requestor + '</td>';
      tableContent += '</tr>';
    }





    $('#projectGrid').append(tableContent);


  }

  function onError(error) {
    alert('Error');
  }




}); ///End of Document Ready Function



///Sort Project Table
jQuery(document).ready(function() {

  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $(".sortTable").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });


  jQuery(document).on("click", 'th', function() {
    if ($(this).is('.asc')) {
      $(this).removeClass('asc');
      $(this).addClass('desc selected');

      sortOrder = -1;
    } else {
      $(this).addClass('asc selected');
      $(this).removeClass('desc');

      sortOrder = 1;
    }

    var table = $(this).parents('table').eq(0)
    var rows = table.find('tr:gt(0)').toArray().sort(comparer($(this).index()))
    this.asc = !this.asc
    if (!this.asc) {
      rows = rows.reverse()
    }
    for (var i = 0; i < rows.length; i++) {
      table.append(rows[i])

    }


  })

}); //close of document ready

//Update Project Tracker list item Script

$(document).ready(function() {

  jQuery(document).on("click", '#UpdateListItem', function() {
    updateListItem();
  }); //button closed

  jQuery(document).on("click", '#UpdateClose', function() {
    $("#updateForm").fadeOut();
  }); //button closed


  function updateListItem() {

    //var listName = "ProjectTracker";
    var url = _spPageContextInfo.webAbsoluteUrl;
    var myID = $("#itemID").val();
    var listName = "ProjectTracker";
    var office = $("#uOffice").val();
    var pTitle = $("#uProjectTitle").val();
    var priority = $("#uPriority").val();
    var startDate = $("#uStartDate").val();
    var assignedTo = $("#uAssignedTo").val();
    var status = $("#uStatus").val();
    var requestor = $("#uRequestor").val();
    var title = "New Updated Information";
    var itemType = "SP.Data.Project_x0020_TrackerListItem";

    console.log(office);

    var item = {
      "__metadata": {
        "type": itemType
      },
      "Title": title, 
      "Office": office,
      "ProjectTitle": pTitle,
      "Priority": priority,
      "StartDate": startDate,
      "AssignedTo": assignedTo,
      "Status": status,
      "Requestor": requestor
    };

    $.ajax({
      url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('ProjectTracker')/items(" + myID + ")",
      type: "POST",
      type: "POST",
      contentType: "application/json;odata=verbose",
      data: JSON.stringify(item),
      headers: {
        "Accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
        "X-HTTP-Method": "MERGE",
        "If-Match": "*"
      },
      success: onSuccess,
      error: onError
    });

    function onSuccess(data) {
      jQuery("#success").fadeIn();
    }

    function onError(error) {

      alert(JSON.stringify(error));
    }
  } //Function close


});