Ta sama treść w formularzu może zostać wpisana tylko raz.

Co mam dopisać, aby po wpisaniu w formularzu jakiegoś wyrazu i zatwierdzeniu submitem, nie można było go później wpisać jeszcze raz, dopiero po odświeżeniu strony?
W razie czego używam ajax dla tego formularza bez odświeżania strony po użyciu submitu.

https://www.w3schools.com/jsref/prop_text_readonly.asp

Nie chcę wyłączać możliwości użycia formularza, tylko zapobiec ponownego wpisywania tej samej wartości w tym formularzu. Formularz ma zastosowanie wielokrotne - tworzy on tabele z nazwą/wartością, którą podam w formularzu, nie chcę by nazwy tabel się powtarzały, więc chciałem dodać warunek, tylko nie wiem jak go zinterpretować, by sprawdzał czy tabela o takiej wartości/nazwie istnieje, jeśli tak, należy podać inną wartość.
Nie wiem czy da się to zachować w samym warunku, ale dla zrozumienia chciałbym, aby to działało mniej więcej tak:
var zmienna = document.getElementById("zmienna").value;
if(nowa zmienna == wcześniej zapisana zmienna){
wykonaj kod;
}
else {
wykonaj kod;
}

tylko teraz pisząc ten przykład przypomniało mi się, że po każdym użytym submicie, zmienna nadpisuje się nową wartością, więc if nie ma z czego porównywać, więc nie zadziała.
A jakby zapisać kilka wartości do zmiennej i na ich podstawie porównywać istnienie? A może tablica?

Po prostu nie resetuj pól po submit, (czyli nie używaj reset), ew. użyj localStorage.

tab = document.getElementById("id_of_table");
inp_name = document.getElementById("id_of_input_field_for_name");
inp_val = document.getElementById("id_of_input_field_for_value");

for (i in tab.rows) {
  if(tab.rows[i].cells[0].innerHTML==inp_name.value && tab.rows[i].cells[1].innerHTML==inp_val.value) {
    inp_name.value='';
    inp_val.value='';
    alert("Duplikat rekordu tabeli");
  }
}

Może coś w te klocki - funkcja porównująca wiersze tabeli z aktualną wartością pól "input" i odpalana przed submit'em

A ja dodam, że jeśli chce się mieć pewność, że złośliwy użytkownik nie nawciska nam danych niezgodnych z tym, czego byśmy oczekiwali, to należy je później ponownie sprawdzić po stronie serwera.

To localStorage nie jest chyba zaimplementowane we wszystkich przeglądarkach... wydaje mi się, że uniwersalniejsze byłyby cookies.

Niedawno widziałem (w3schools) do rozwiązania takich sprawdzeń a więc błędów użycie throw, try, catch, finally. Czy to jest dobra praktyka?

Vorname Name napisał(a):

To localStorage nie jest chyba zaimplementowane we wszystkich przeglądarkach...

Piszą, że 90%:
https://caniuse.com/#search=storage

Widzę, że nie do końca wiecie o co mi chodzi.
Posiadam nawigacje, która wyposażona jest w zakładki https://getbootstrap.com/docs/4.3/components/navs/ (pisząc tabele, mogłem was wprowadzić w błąd za co przepraszam).
Aktualnie na stronie posiadamy jedną zakładką, która przenosi nas do formularzu. Formularz posiada jedno pole input text oraz submit do zatwierdzania, wpisując jakąś wartość, do tego inputu i zatwierdzeniu formularza submitem, wykonuje się mój kod z metodą append:

...
..
var submitPost = document.getElementById("quest_branches");
		submitPost.value="";
		$(".needs-validation").removeClass("was-validated")
		
		$('#submenu-branches').append('<li id="branch_id_'+quest_branches+'"><a href="#" id="indown_branch_id_'+quest_branches+'"><i class="fa fa-hashtag"></i>'+quest_branches+'</a></li>');
..
...

Zmienna quest_branches, to oczywiście zmienna, której przypisujemy wpisaną wartość w formularzu, następnie append przechwyca wartość zmiennej quest_branches i tworzy jak widać zakładkę, która jednocześnie otrzymuje nazwę z tej wartości, dodatkowo to samo tyczy się li oraz a, które otrzymują id o wartości quest_branches podanej w formularzu.
Teraz, jak widać całe zamieszanie robi "ta generująca się" zakładka.
Tak więc jak mam zapisać ifa, który porównuje wartość zmiennej wpisanej, która nie istnieje, ale może w przyszłości zostać wygenerowana, metodą append do wartości zmiennej, która jest już wygenerowana.
Jeśli nie rozumiecie o co mi chodzi, to zapraszam do mojego projektu:http://styx.ct8.pl
Wejdźcie w zakładkę "Gałęzie" i potem "Menu gałęzi" i spróbujcie sami.

Ps.

mmilch napisał(a):

tab = document.getElementById("id_of_table");
inp_name = document.getElementById("id_of_input_field_for_name");
inp_val = document.getElementById("id_of_input_field_for_value");

for (i in tab.rows) {
  if(tab.rows[i].cells[0].innerHTML==inp_name.value && tab.rows[i].cells[1].innerHTML==inp_val.value) {
    inp_name.value='';
    inp_val.value='';
    alert("Duplikat rekordu tabeli");
  }
}

Może coś w te klocki - funkcja porównująca wiersze tabeli z aktualną wartością pól "input" i odpalana przed submit'em

Dobrze myślisz, ale id_of_table - id zakładki jest generowane za pomocą wartości z formularza, więc jak wychwycić taką dowolną wartość?

No to trza było tak od razu.

Możesz sobie zatem z drzewa DOM wyczytać wszystkie ID-y gałęzi, jakie tam masz:

lista = document.querySelectorAll("[id^='branch_id']");
for (i = 0; i < lista.length; i++) {
  console.log(lista[i].id);
}

I sprawdzić, czy ten nowotworzony nie pokrywa się z którymś już istniejącym.

A tak poza tym z dwóch przycisków "dodaj gałąź" i "zapisz zmiany" jeden jest zbędny.

Tak, ale wciąż nic nie pomaga, żadnych zmian nie widzę w konsoli po dodaniu tego skryptu.