I have the following code :

      <input type="radio" id="firstAppointment" name="choose-option" value="1">
      <span> Subscription1 </span>
  <div style="margin-top: 40px;">
    <input type="radio" id="secondAppointment" name="choose-option" value="2">
      <span> Subscription2 </span>
        <input type="submit" value="submit" id="submit" onclick="myCreateListItem()" disabled>

the following javascript for adding:

function createListItem() {//main
    var clientContext = new SP.ClientContext('/sites/sharedareas/fqt');
    var oList = clientContext.get_web().get_lists().getByTitle('Two-Radio-Buttons');
    var itemCreateInfo = new SP.ListItemCreationInformation();

    this.oListItem = oList.addItem(itemCreateInfo);

    if(document.getElementById('firstAppointment').checked) { //adds item to list
        oListItem.set_item('Username', username[1]);
        oListItem.set_item('firstAppointment', 'x');
        oListItem.set_item('secondAppointment', ' ');

    if (document.getElementById('secondAppointment').checked) { //adds item to list
        oListItem.set_item('Username', username[1]);
        oListItem.set_item('secondAppointment', 'x');
        oListItem.set_item('firstAppointment', ' ');

    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));


function onQuerySucceeded() {
    alert('Thank you ' + oListItem.get_item('Username') + ' for your registration');

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());

and the following script for querry:

function queryListItem(){
        var context = new SP.ClientContext('/sites/sharedareas/fqt');
        var list = context.get_web().get_lists().getByTitle('Two-Radio-Buttons');
        var caml = new SP.CamlQuery();

        caml.set_viewXml("<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' + '<Value Type=\'Number\'>1</Value></Geq></Where></Query></View>");

        returnedItems = list.getItems(caml);
        context.executeQueryAsync(onSucceededCallback, onFailedCallback);
    function onSucceededCallback(sender, args) {
        var enumerator = returnedItems.getEnumerator();

        while (enumerator.moveNext()) {
            var listItem = enumerator.get_current();

            if (username[1]==listItem.get_item('Username')){
                if (listItem.get_item('firstAppointment')){ //retrive from list and cancels this option
                if (listItem.get_item('secondAppointment')){ //retrive from list and cancels this option

    function onFailedCallback(sender, args) {

The script works like this: select one of the radio buttons and hit subscribe, after that the page makes a refresh and disables the option selected and displays a message, and the other option is available.

My problem is: How can I update the list if the user selects the second option and hits submit again?

enter image description here

  • Is that you want to keep the same value of radio button when page gets reloaded? – Niranjan Kulkarni Jul 21 '16 at 13:25
  • After first submitting if the user wants to change his mind he selects the second option and the sharepoint must upadate – Bogdan Moraru Jul 21 '16 at 13:43
  • For example: if he selects first Appointment and hits submit - in the sharepoint list I will have name and an x in the first Appointment column. And if he changes his mind he selects second Appointment, submits and (here I am failing to do that) in the sharepoint list remains his name and the x changes from first Appointment to second Appointment . I hope I am making my self clear enough. – Bogdan Moraru Jul 21 '16 at 13:46
  • What is wrong with one Choice Column where the User selects First or Second? You could use CSR to display it as 1 and 2 – Danny '365CSI' Engelman Jul 21 '16 at 15:35
  • I want to give the user the possibility, if he changes his mind, to change the appointment. I already made the template where you can choose what appointment you want and register, and the form stops there. – Bogdan Moraru Jul 22 '16 at 6:14

I'd store a global variable, lets say var listItemID = -1; then whenever you create an item, the return value will be the new item id, once that comes back just bind the new list item id to the variable. In your logic, createListItem() to FIRST check if the listItemID !== -1, and if it does, update based off the value in the form, else create as normal.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.