Надсилання інформації з HTML-форми до списку SharePoint без використання Infopath

Я створив пусту форму на веб-сторінці HTML через мій сайт Sharepoint, який називається http: //.../testform.html .

<form>
    <input type='text' id='name'>
    <input type='submit' id='submitdata' value='submit'>
</form>

і я намагаюся отримати вхідні дані до списку SharePoint під назвою Test .

Таким чином, я придумав код нижче, і я перевірив його за допомогою Редактор сценаріїв веб-частини і він працював.

  <script type="text/javascript">
  $(document).ready(function() {

      $('#submitdata').click(function() {
          var name = $('#name').val();
          var list = "Test";
          addListItem(name, list);
      });
  });

  function addListItem(name, listname) {

      var listType = "Custom List";
      var item = {'__metadata': {'type': 'SP.Data.TestListItem'},
          'Title': name
      }
      var siteUrl = "https://intelshare.intelink.gov/sites/carm"

      $.ajax({
          url: siteUrl + "/_api/web/lists/getByTitle('" + listname + "')/items",
          type: "POST",
          contentType: "application/json;odata=verbose",
          data: JSON.stringify(item),
          headers: {
              "accept": "application/json;odata=verbose",
              "X-RequestDigest": $("#__REQUESTDIGEST").val(),
          },
          success: function(data) {

              console.log("done");
          },
          error: function(err) {
              console.log(JSON.stringify(err));
          }
      });
  }
  </script>

Проте, коли я використовую той самий код з веб-редактора сценаріїв на сторінці html, виникає помилка нижче:

Перевірка безпеки для цієї сторінки недійсна й може бути   пошкоджено. Використовуйте кнопку "Назад" веб-переглядача, щоб спробувати   операція знову

i завантажений

<script type="text/javascript" src="./jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="./jquery.SPServices.min.js"></script>

Я спробував ознайомитися з помилкою, і придумав виклик data.d.GetContextWebInformation.FormDigestValue , але не знаю, як включити його, оскільки він вимикається. Я новачок у java і потребує зрушення в правильному напрямку.

2

5 Відповіді

Знайшли відповідь на цю сторінку . Дякуємо за ваш внесок.

Схоже, що помилка виникає, оскільки дайджест форми закінчився на сторінці.

тому я використовував ці функції

var webUrl = "https://weburl"

function getFormDigest(webUrl) {
    return $.ajax({
        url: webUrl + "/_api/contextinfo",
        method: "POST",
        headers: { "Accept": "application/json; odata=verbose" }
    });
}

function createListItem(webUrl, listName, itemProperties) {
    return getFormDigest(webUrl).then(function (data) {

        return $.ajax({
            url: webUrl + "/_api/web/lists/getbytitle('" + listName + "')/items",
            type: "POST",
            processData: false,
            contentType: "application/json;odata=verbose",
            data: JSON.stringify(itemProperties),
            headers: {
                "Accept": "application/json;odata=verbose",
                "X-RequestDigest": data.d.GetContextWebInformation.FormDigestValue
            }
        });
    });
}    

і назвав їх так:

//Create a Task item
var taskProperties = {
    '__metadata': { 'type': 'SP.Data.TestListItem' },
    'Title': name,
};

createListItem(_spPageContextInfo.webAbsoluteUrl, 'Test', taskProperties)

.done(function (data) {
    console.log('Task has been created successfully');
})
.fail(function (error) {
    console.log(JSON.stringify(error));
});
2
додано

спробуйте це ......

<div class="col-md-6">
                <div class="form-group">
                    
                    <div class="col-md-8">
                        <input name="CTName" id="CTName" type="text" class="form-control " /> 
                    </div>
            <div class="col-md-6">
                <div class="form-group">
                    
                    <div class="col-md-8">
                        <input id="CTPhone" type="text" class="form-control " /> 
                    </div>
                </div>

    <div class="row text-center mrgtop50">
        Submit
    </div>

function ItemSubmit() {
            $("#Submit").click(function() {
            debugger;
                AddItemToList(listItemEntity);                
            });
        }
        function InitialData() {
        debugger;
            context = new SP.ClientContext.get_current();
            web = context.get_web();
            context.load(web);
            context.executeQueryAsync(onRequestSuccess, onRequestFailure);
        }
        function onRequestSuccess() {
            Url = web.get_url();
            debugger;
            GetListItemEntity(Url);
        }
        function onRequestFailure(sender, args) {
            alert("Error Occured:" + args.get_message());
        }
        function GetListItemEntity(webUrl) {
            var queryUrl = webUrl + "/_api/lists/getbytitle('--ListName--')?$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(listItemEntity) {
            //reading text box values
            debugger;
                var CTName = $("#CTName").val();
                var CTPhone = $("CTPhone").val();

            try {
                var queryUrl = Url + "/_api/lists/GetByTitle('--ListName--')/items";
                $.ajax({
                    url: queryUrl,
                    type: "POST",
                    contentType: "application/json;odata=verbose",
                    data: JSON.stringify(
                        {
                            '__metadata': {
                                'type': listItemEntity
                            },
                            'Name' : CTName,
                            'Phone': CTPhone,

                        }),
                    headers: {
                        "accept": "application/json;odata=verbose",
                        "X-RequestDigest": $("#__REQUESTDIGEST").val()
                    }, success: onQuerySuccess,
                    error: onQueryFailure
                });
            }
            catch (ex) {
                alert("Exception" + ex.message);
            }
        }
        function onQuerySuccess(data, request) {

            alert("Contract Form Submitted");
            window.location = _spPageContextInfo.webAbsoluteUrl + "/SitePages/.....";
            return false;

        }
        function onQueryFailure(error) {

        }
0
додано
Це не спрацювало. Я натиснув на посилання і нічого не сталося, а вікна вводу не оновилися. Мій код працює на веб-сторінці, але не на порожній HTML-сторінці.
додано Автор dalore, джерело
Ви можете покласти все це разом, щоб я міг бачити, як він повинен виглядати? Я збентежений.
додано Автор dalore, джерело
"ItemSubmit" не визначено
додано Автор dalore, джерело
Ні я не включив що
додано Автор dalore, джерело
я зрозумів це і розмістив його ... спасибі за вашу допомогу
додано Автор dalore, джерело
спробуйте вказаний нижче код, який буде працювати
додано Автор Deer Hunter, джерело
можливо, ви забули ці посилання <script src = "bootstrap.min.js"> </script> <script src = "createdjsfile"> </script>
додано Автор Deer Hunter, джерело
Add this on top function ItemSubmit(), create separate JS and the code from var context to end not HTML div



   var context;                                                                                                              
    var web;                                                                                                                      
    var listItemEntity;                                                                                                           
    var ItemID;                                                                                                     
    $(document).ready(function() {                                                
                 getSPOffset();                                                                                    
    SP.SOD.excuteFunc('sp.js','sp.ClientContext',InitialDate);                                        
    ItemSubmit();                                                                                                
            }

і створити окремий файл ascx для HTML-коду і додати посилання JS file.

<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />          
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600" rel="stylesheet" />
link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<script src="bootstrap.min.js"></script>
<script src="createdjsfile"></script>
0
додано

це файл ascx

<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />          
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600" rel="stylesheet" />
link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<script src="bootstrap.min.js"></script>
<script src="createdjsfile"></script>
<div class="col-md-6">
                <div class="form-group">
                    
                    <div class="col-md-8">
                        <input name="CTName" id="CTName" type="text" class="form-control " /> 
                    </div>
            <div class="col-md-6">
                <div class="form-group">
                    
                    <div class="col-md-8">
                        <input id="CTPhone" type="text" class="form-control " /> 
                    </div>
                </div>

    <div class="row text-center mrgtop50">
        Submit
    </div>
0
додано

це файл JS

var context;                                                                                                              
    var web;                                                                                                                      
    var listItemEntity;                                                                                                           
    var ItemID;                                                                                                     
    $(document).ready(function() {                                                
                 getSPOffset();                                                                                    
    SP.SOD.excuteFunc('sp.js','sp.ClientContext',InitialDate);                                        
    ItemSubmit();                                                                                                
            }
function ItemSubmit() {
            $("#Submit").click(function() {
            debugger;
                AddItemToList(listItemEntity);                
            });
        }
        function InitialData() {
        debugger;
            context = new SP.ClientContext.get_current();
            web = context.get_web();
            context.load(web);
            context.executeQueryAsync(onRequestSuccess, onRequestFailure);
        }
        function onRequestSuccess() {
            Url = web.get_url();
            debugger;
            GetListItemEntity(Url);
        }
        function onRequestFailure(sender, args) {
            alert("Error Occured:" + args.get_message());
        }
        function GetListItemEntity(webUrl) {
            var queryUrl = webUrl + "/_api/lists/getbytitle('--ListName--')?$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(listItemEntity) {
            //reading text box values
            debugger;
                var CTName = $("#CTName").val();
                var CTPhone = $("CTPhone").val();

            try {
                var queryUrl = Url + "/_api/lists/GetByTitle('--ListName--')/items";
                $.ajax({
                    url: queryUrl,
                    type: "POST",
                    contentType: "application/json;odata=verbose",
                    data: JSON.stringify(
                        {
                            '__metadata': {
                                'type': listItemEntity
                            },
                            'Name' : CTName,
                            'Phone': CTPhone,

                        }),
                    headers: {
                        "accept": "application/json;odata=verbose",
                        "X-RequestDigest": $("#__REQUESTDIGEST").val()
                    }, success: onQuerySuccess,
                    error: onQueryFailure
                });
            }
            catch (ex) {
                alert("Exception" + ex.message);
            }
        }
        function onQuerySuccess(data, request) {

            alert("Contract Form Submitted");
            window.location = _spPageContextInfo.webAbsoluteUrl + "/SitePages/.....";
            return false;

        }
        function onQueryFailure(error) {

        }
0
додано
ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram