Saving user input to List

[Tanya]

I’m having issues with a List. I have a SP page set up so users can input a value into a box, click submit, and then that value is saved to the appropriate cell in a List. Except, once submit is clicked, I get confirmation the value save successfully, but when you go back to the list it is actually deleting the previous value and leaving it null/blank. I am using the same format of code for each list item, but it is only doing this on a handful of items. The code used is as follows:

<table>
    <tr>
        <td>Example</td>
    </tr>

    <tr>
        <td>
            <input id="myexampleinput" name="myexampleinput" type="textbox" />
        </td>
        <td>
            <input name="ADD" id="btnADD" type="button" value="Submit" onclick="saveMyExample()" />
        </td>
    </tr>

</table>

<script language="javascript" type="text/javascript">
    function saveMyExample() {
        var clientContext = SP.ClientContext.get_current();
        var list = clientContext.get_web().get_lists().getByTitle('MyCustomList');

        var camlQuery = new SP.CamlQuery();
        camlQuery.set_viewXml('<View><OrderBy><FieldRef Name="ID" /></OrderBy><Query><Where><Geq><FieldRef Name="ID" /><Value Type="Number">2</Value></Geq></Where></Query><RowLimit>2</RowLimit></View>');
        var items = list.getItems(camlQuery);
        clientContext.load(items);
        clientContext.executeQueryAsync(
            function () {
                if (items.get_count() > 0) {
                    var myexampleItem = items.getItemAtIndex(0);
                    myexampleItem.set_item('fnbi', document.getElementById("myexampleinput").value);
                    myexampleItem.update();

                    clientContext.executeQueryAsync(function () {
                        alert('successfully saved new value!');
                        
                    },
                        function (sender, args) {
                            alert('Could not update item: ' + args.get_message());
                            
                        });
                }
                else {
                    alert('List is empty!');
                }
            },
            function (sender, args) {
                alert('Could not retrieve items from list: ' + args.get_message());
                
            }
        );
    }
</script>

[Alexander Bautz]

I’m not sure I understand what you are doing. I looked at the code and it will find the last item in the list and update the value in the field with internal name “fnbi” with the value from your myexampleinput field.

It looks like it should work and it is not easy to find out what is wrong without looking at it.

Are you sure you don’t have multiple inputs in the page with the same ID (myexampleinput)? – if so, it will pull the value from the last one – and if it is empty your field value will be cleared.

You can hit F12 to open the dev tools and select “Console” and type in this to see if the value you enter is picked up:

document.getElementById("myexampleinput").value

Alexander

[Tanya]

So this was a tricky one, that I think I have figured out. On this SP page, there are two Snippets, each hold separate values for two different Lists. So I thought using similar/same variables in different snippets that worked with different Lists it would be ok. When you mentioned making sure it wasn’t being used somewhere out, that started my wheels turning. I changed the variables to have a “b” at the end, just enough to change them between the Snippets, and updated the List items with a b at the end as well (the Lists are basically the same thing for two different audiences). Bingo! It now works. Thank you so much! Even the simplest of comments make the world of difference!

[Alexander Bautz]

I’m glad you figured it out.

Alexander

[Author]

Posts