diff options
9 files changed, 243 insertions, 132 deletions
diff --git a/basicConfig/properties/messages.properties b/basicConfig/properties/messages.properties index 5f24f0da..6674d0bd 100644 --- a/basicConfig/properties/messages.properties +++ b/basicConfig/properties/messages.properties @@ -130,10 +130,9 @@ gui.residency.search=Search gui.residency.clear=Clear gui.residency.proceed=Proceed gui.residency.updated=Updated your input -gui.residency.found=Found {0} results +gui.residency.found=Found {0} results, click on one result to refine your search gui.residency.unique=Unique result found, please proceed gui.residency.error=Error on Backend Call -gui.residency.apply=Apply gui.residency.input.postleitzahl=Postcode gui.residency.input.municipality=Municipality gui.residency.input.village=Village diff --git a/basicConfig/properties/messages_de.properties b/basicConfig/properties/messages_de.properties index 95489b32..9c496903 100644 --- a/basicConfig/properties/messages_de.properties +++ b/basicConfig/properties/messages_de.properties @@ -128,10 +128,9 @@ gui.residency.search=Suche gui.residency.clear=Löschen gui.residency.proceed=Fortfahren gui.residency.updated=Eingabe aktualisiert -gui.residency.found={0} Ergebnisse gefunden +gui.residency.found={0} Ergebnisse gefunden, klicken Sie auf ein Ergebnis um die Suche zu verfeinern gui.residency.unique=Eindeutiges Ergebnis gefunden, bitte fortfahren gui.residency.error=Fehler bei Addresssuche -gui.residency.apply=Übernehmen gui.residency.input.postleitzahl=PLZ gui.residency.input.municipality=Gemeinde gui.residency.input.village=Ortschaft diff --git a/basicConfig/templates/residency.html b/basicConfig/templates/residency.html index 8192a068..7a832aea 100644 --- a/basicConfig/templates/residency.html +++ b/basicConfig/templates/residency.html @@ -6,8 +6,8 @@ <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta name="viewport" content="width=device-width, initial-scale=1"> - <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/> - <script type="text/javascript" src="$contextPath/static/js/jquery-3.6.0.js" + <link rel="stylesheet" href="../webcontent/css/css_country.css" th:href="@{/static/css/css_country.css}"/> + <script type="text/javascript" src="../webcontent/js/jquery-3.6.0.js" th:attr="src=@{/static/js/jquery-3.6.0.min.js}"></script> <title th:text="#{gui.residency.title}">Österreichischer Wohnsitz</title> <script type="text/javascript" th:inline="javascript"> @@ -23,12 +23,16 @@ $("#loading").hide(); } }); + $("#inputForm input[type='text']").keyup(function (event) { + if (event.keyCode === 13) { + $("#buttonSearch").click(); + } + }); }); function search() { let updatedText = /*[[#{gui.residency.updated}]]*/ 'Updated text'; let errorText = /*[[#{gui.residency.error}]]*/ 'Error'; - let applyText = /*[[#{gui.residency.apply}]]*/ 'Apply'; let foundText = /*[[#{gui.residency.found}]]*/ 'Found {0}'; let uniqueText = /*[[#{gui.residency.unique}]]*/ 'Unique'; let invalidInputText = /*[[#{gui.residency.header.inputinvalid}]]*/ 'Invalid'; @@ -42,7 +46,7 @@ url: "http://localhost:8080/ms_connector/residency/search", data: $("#inputForm").serialize() }).done(function (data, textStatus, jqXHR) { - if (data["resultCount"] == 1) { + if (data["resultCount"] === 1) { $("#textResult").show().text(uniqueText); $("#tableResult tbody").empty(); $("#tableResult").hide(); @@ -59,23 +63,23 @@ $.each(data.results, function (i, output) { $("#tableResult tbody") .append($("<tr>") - .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "")) + .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "").css("text-align", "right")) .append($("<td>").text(output["municipality"] !== null ? output["municipality"] : "")) .append($("<td>").text(output["village"] !== null ? output["village"] : "")) .append($("<td>").text(output["street"] !== null ? output["street"] : "")) - .append($("<td>").text(output["number"] !== null ? output["number"] : "")) - .append($("<td>").text(applyText).attr("href", "#").click(function () { - $("#inputForm #inputPostleitzahl").val($(this).parent().children("td:nth-child(1)").text()); - $("#inputForm #inputMunicipality").val($(this).parent().children("td:nth-child(2)").text()); - $("#inputForm #inputVillage").val($(this).parent().children("td:nth-child(3)").text()); - $("#inputForm #inputStreet").val($(this).parent().children("td:nth-child(4)").text()); - $("#inputForm #inputNumber").val($(this).parent().children("td:nth-child(5)").text()); + .append($("<td>").text(output["number"] !== null ? output["number"] : "").css("text-align", "right")) + .css("cursor", "pointer").click(function () { + $("#inputForm #inputPostleitzahl").val($(this).children("td:nth-child(1)").text()); + $("#inputForm #inputMunicipality").val($(this).children("td:nth-child(2)").text()); + $("#inputForm #inputVillage").val($(this).children("td:nth-child(3)").text()); + $("#inputForm #inputStreet").val($(this).children("td:nth-child(4)").text()); + $("#inputForm #inputNumber").val($(this).children("td:nth-child(5)").text()); $("#textResult").show().text(updatedText); search(); - })) + }) ); }) - if (data.results.length == 0) { + if (data.results.length === 0) { $("#tableResult").hide(); } }).fail(function (jqXHR, textStatus, errorThrown) { @@ -93,9 +97,46 @@ } </script> <style> - td { + #residency label { + width: 10em; + display: inline-block; + margin-bottom: 0.5em; + } + + #residency input { + width: 15em; + display: inline-block; + margin-bottom: 0.5em; + } + + #result { + margin-bottom: 4em; + } + + button { padding: 0.5em; margin: 0.5em; + width: 8em; + } + + .block { + width: 100%; + } + + #tableResult td, #tableResult th { + padding: 1em 0.5em; + } + + #tableResult a { + text-decoration: underline; + } + + #tableResult { + border-collapse: collapse; + } + + #tableResult tr { + border-bottom: 1px solid black; } </style> </head> @@ -135,7 +176,8 @@ <div id="residency"> <form id="inputForm" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <div th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</div> + <div><p th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</p> + </div> <div> <label for="inputPostleitzahl" th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</label> <input type="text" id="inputPostleitzahl" name="postleitzahl" value=""/> @@ -156,38 +198,42 @@ <label for="inputNumber" th:text="#{gui.residency.input.number}">Number</label> <input type="text" id="inputNumber" name="number" value=""/> </div> - <div> - <button type="button" class="block" onclick="search()" th:attr="value=#{gui.residency.search}">Search + <div class="block"> + <button type="button" id="buttonSearch" onclick="search()" th:text="#{gui.residency.search}"> + Search </button> - </div> - <div> - <button type="button" class="block" onclick="clearInput()" th:attr="value=#{gui.residency.clear}">Clear + <button type="button" id="buttonClear" onclick="clearInput()" th:text="#{gui.residency.clear}"> + Clear </button> - </div> - <div> - <button type="button" class="block" th:attr="value=#{gui.residency.proceed}">Proceed</button> - </div> - <div> - <img id="loading" src="$contextPath/static/img/ajax-loader.gif" - th:attr="src=@{/static/img/ajax-loader.gif}"/> + <button type="button" id="buttonProceed" th:text="#{gui.residency.proceed}">Proceed</button> </div> <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/> </form> </div> + <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> + <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.residency.cancel}">Cancel</button> + <input type="hidden" name="stopAuthProcess" value="true"> + <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> + </form> + + <div> + <img id="loading" src="$contextPath/static/img/ajax-loader.gif" + th:attr="src=@{/static/img/ajax-loader.gif}" style="display: none"/> + </div> + <div id="result"> <div> - <p><span id="textResult"></span></p> + <p><span id="textResult" style="display: none"></span></p> </div> - <table id="tableResult"> + <table id="tableResult" style="display: none"> <thead> <tr> - <th th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</th> + <th th:text="#{gui.residency.input.postleitzahl}" style="text-align: right">Postcode</th> <th th:text="#{gui.residency.input.municipality}">Municipality</th> <th th:text="#{gui.residency.input.village}">Village</th> <th th:text="#{gui.residency.input.street}">Street</th> - <th th:text="#{gui.residency.input.number}">Number</th> - <th th:text="#{gui.residency.apply}">Apply</th> + <th th:text="#{gui.residency.input.number}" style="text-align: right">Number</th> </tr> </thead> <tbody> @@ -196,13 +242,6 @@ </table> </div> - <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel" - th:attr="value=#{gui.residency.cancel}"> - <input type="hidden" name="stopAuthProcess" value="true"> - <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> - </form> - </div> <footer> <div class="copyright">© BUNDESMINISTERIUM FÜR INNERES</div> diff --git a/connector/src/main/resources/properties/messages.properties b/connector/src/main/resources/properties/messages.properties index 3f662ef9..23dd48c3 100644 --- a/connector/src/main/resources/properties/messages.properties +++ b/connector/src/main/resources/properties/messages.properties @@ -116,10 +116,9 @@ gui.residency.search=Search gui.residency.clear=Clear gui.residency.proceed=Proceed gui.residency.updated=Updated your input -gui.residency.found=Found {0} results +gui.residency.found=Found {0} results, click on one result to refine your search gui.residency.unique=Unique result found, please proceed gui.residency.error=Error on Backend Call -gui.residency.apply=Apply gui.residency.input.postleitzahl=Postcode gui.residency.input.municipality=Municipality gui.residency.input.village=Village diff --git a/connector/src/main/resources/properties/messages_de.properties b/connector/src/main/resources/properties/messages_de.properties index c0f3c9a5..26b1b3c6 100644 --- a/connector/src/main/resources/properties/messages_de.properties +++ b/connector/src/main/resources/properties/messages_de.properties @@ -117,10 +117,9 @@ gui.residency.search=Suche gui.residency.clear=Löschen gui.residency.proceed=Fortfahren gui.residency.updated=Eingabe aktualisiert -gui.residency.found={0} Ergebnisse gefunden +gui.residency.found={0} Ergebnisse gefunden, klicken Sie auf ein Ergebnis um die Suche zu verfeinern gui.residency.unique=Eindeutiges Ergebnis gefunden, bitte fortfahren gui.residency.error=Fehler bei Addresssuche -gui.residency.apply=Übernehmen gui.residency.input.postleitzahl=PLZ gui.residency.input.municipality=Gemeinde gui.residency.input.village=Ortschaft diff --git a/connector/src/main/resources/templates/residency.html b/connector/src/main/resources/templates/residency.html index 8192a068..7a832aea 100644 --- a/connector/src/main/resources/templates/residency.html +++ b/connector/src/main/resources/templates/residency.html @@ -6,8 +6,8 @@ <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta name="viewport" content="width=device-width, initial-scale=1"> - <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/> - <script type="text/javascript" src="$contextPath/static/js/jquery-3.6.0.js" + <link rel="stylesheet" href="../webcontent/css/css_country.css" th:href="@{/static/css/css_country.css}"/> + <script type="text/javascript" src="../webcontent/js/jquery-3.6.0.js" th:attr="src=@{/static/js/jquery-3.6.0.min.js}"></script> <title th:text="#{gui.residency.title}">Österreichischer Wohnsitz</title> <script type="text/javascript" th:inline="javascript"> @@ -23,12 +23,16 @@ $("#loading").hide(); } }); + $("#inputForm input[type='text']").keyup(function (event) { + if (event.keyCode === 13) { + $("#buttonSearch").click(); + } + }); }); function search() { let updatedText = /*[[#{gui.residency.updated}]]*/ 'Updated text'; let errorText = /*[[#{gui.residency.error}]]*/ 'Error'; - let applyText = /*[[#{gui.residency.apply}]]*/ 'Apply'; let foundText = /*[[#{gui.residency.found}]]*/ 'Found {0}'; let uniqueText = /*[[#{gui.residency.unique}]]*/ 'Unique'; let invalidInputText = /*[[#{gui.residency.header.inputinvalid}]]*/ 'Invalid'; @@ -42,7 +46,7 @@ url: "http://localhost:8080/ms_connector/residency/search", data: $("#inputForm").serialize() }).done(function (data, textStatus, jqXHR) { - if (data["resultCount"] == 1) { + if (data["resultCount"] === 1) { $("#textResult").show().text(uniqueText); $("#tableResult tbody").empty(); $("#tableResult").hide(); @@ -59,23 +63,23 @@ $.each(data.results, function (i, output) { $("#tableResult tbody") .append($("<tr>") - .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "")) + .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "").css("text-align", "right")) .append($("<td>").text(output["municipality"] !== null ? output["municipality"] : "")) .append($("<td>").text(output["village"] !== null ? output["village"] : "")) .append($("<td>").text(output["street"] !== null ? output["street"] : "")) - .append($("<td>").text(output["number"] !== null ? output["number"] : "")) - .append($("<td>").text(applyText).attr("href", "#").click(function () { - $("#inputForm #inputPostleitzahl").val($(this).parent().children("td:nth-child(1)").text()); - $("#inputForm #inputMunicipality").val($(this).parent().children("td:nth-child(2)").text()); - $("#inputForm #inputVillage").val($(this).parent().children("td:nth-child(3)").text()); - $("#inputForm #inputStreet").val($(this).parent().children("td:nth-child(4)").text()); - $("#inputForm #inputNumber").val($(this).parent().children("td:nth-child(5)").text()); + .append($("<td>").text(output["number"] !== null ? output["number"] : "").css("text-align", "right")) + .css("cursor", "pointer").click(function () { + $("#inputForm #inputPostleitzahl").val($(this).children("td:nth-child(1)").text()); + $("#inputForm #inputMunicipality").val($(this).children("td:nth-child(2)").text()); + $("#inputForm #inputVillage").val($(this).children("td:nth-child(3)").text()); + $("#inputForm #inputStreet").val($(this).children("td:nth-child(4)").text()); + $("#inputForm #inputNumber").val($(this).children("td:nth-child(5)").text()); $("#textResult").show().text(updatedText); search(); - })) + }) ); }) - if (data.results.length == 0) { + if (data.results.length === 0) { $("#tableResult").hide(); } }).fail(function (jqXHR, textStatus, errorThrown) { @@ -93,9 +97,46 @@ } </script> <style> - td { + #residency label { + width: 10em; + display: inline-block; + margin-bottom: 0.5em; + } + + #residency input { + width: 15em; + display: inline-block; + margin-bottom: 0.5em; + } + + #result { + margin-bottom: 4em; + } + + button { padding: 0.5em; margin: 0.5em; + width: 8em; + } + + .block { + width: 100%; + } + + #tableResult td, #tableResult th { + padding: 1em 0.5em; + } + + #tableResult a { + text-decoration: underline; + } + + #tableResult { + border-collapse: collapse; + } + + #tableResult tr { + border-bottom: 1px solid black; } </style> </head> @@ -135,7 +176,8 @@ <div id="residency"> <form id="inputForm" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <div th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</div> + <div><p th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</p> + </div> <div> <label for="inputPostleitzahl" th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</label> <input type="text" id="inputPostleitzahl" name="postleitzahl" value=""/> @@ -156,38 +198,42 @@ <label for="inputNumber" th:text="#{gui.residency.input.number}">Number</label> <input type="text" id="inputNumber" name="number" value=""/> </div> - <div> - <button type="button" class="block" onclick="search()" th:attr="value=#{gui.residency.search}">Search + <div class="block"> + <button type="button" id="buttonSearch" onclick="search()" th:text="#{gui.residency.search}"> + Search </button> - </div> - <div> - <button type="button" class="block" onclick="clearInput()" th:attr="value=#{gui.residency.clear}">Clear + <button type="button" id="buttonClear" onclick="clearInput()" th:text="#{gui.residency.clear}"> + Clear </button> - </div> - <div> - <button type="button" class="block" th:attr="value=#{gui.residency.proceed}">Proceed</button> - </div> - <div> - <img id="loading" src="$contextPath/static/img/ajax-loader.gif" - th:attr="src=@{/static/img/ajax-loader.gif}"/> + <button type="button" id="buttonProceed" th:text="#{gui.residency.proceed}">Proceed</button> </div> <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/> </form> </div> + <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> + <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.residency.cancel}">Cancel</button> + <input type="hidden" name="stopAuthProcess" value="true"> + <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> + </form> + + <div> + <img id="loading" src="$contextPath/static/img/ajax-loader.gif" + th:attr="src=@{/static/img/ajax-loader.gif}" style="display: none"/> + </div> + <div id="result"> <div> - <p><span id="textResult"></span></p> + <p><span id="textResult" style="display: none"></span></p> </div> - <table id="tableResult"> + <table id="tableResult" style="display: none"> <thead> <tr> - <th th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</th> + <th th:text="#{gui.residency.input.postleitzahl}" style="text-align: right">Postcode</th> <th th:text="#{gui.residency.input.municipality}">Municipality</th> <th th:text="#{gui.residency.input.village}">Village</th> <th th:text="#{gui.residency.input.street}">Street</th> - <th th:text="#{gui.residency.input.number}">Number</th> - <th th:text="#{gui.residency.apply}">Apply</th> + <th th:text="#{gui.residency.input.number}" style="text-align: right">Number</th> </tr> </thead> <tbody> @@ -196,13 +242,6 @@ </table> </div> - <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel" - th:attr="value=#{gui.residency.cancel}"> - <input type="hidden" name="stopAuthProcess" value="true"> - <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> - </form> - </div> <footer> <div class="copyright">© BUNDESMINISTERIUM FÜR INNERES</div> diff --git a/connector/src/test/resources/config/properties/messages.properties b/connector/src/test/resources/config/properties/messages.properties index 3f662ef9..23dd48c3 100644 --- a/connector/src/test/resources/config/properties/messages.properties +++ b/connector/src/test/resources/config/properties/messages.properties @@ -116,10 +116,9 @@ gui.residency.search=Search gui.residency.clear=Clear gui.residency.proceed=Proceed gui.residency.updated=Updated your input -gui.residency.found=Found {0} results +gui.residency.found=Found {0} results, click on one result to refine your search gui.residency.unique=Unique result found, please proceed gui.residency.error=Error on Backend Call -gui.residency.apply=Apply gui.residency.input.postleitzahl=Postcode gui.residency.input.municipality=Municipality gui.residency.input.village=Village diff --git a/connector/src/test/resources/config/properties/messages_de.properties b/connector/src/test/resources/config/properties/messages_de.properties index c0f3c9a5..26b1b3c6 100644 --- a/connector/src/test/resources/config/properties/messages_de.properties +++ b/connector/src/test/resources/config/properties/messages_de.properties @@ -117,10 +117,9 @@ gui.residency.search=Suche gui.residency.clear=Löschen gui.residency.proceed=Fortfahren gui.residency.updated=Eingabe aktualisiert -gui.residency.found={0} Ergebnisse gefunden +gui.residency.found={0} Ergebnisse gefunden, klicken Sie auf ein Ergebnis um die Suche zu verfeinern gui.residency.unique=Eindeutiges Ergebnis gefunden, bitte fortfahren gui.residency.error=Fehler bei Addresssuche -gui.residency.apply=Übernehmen gui.residency.input.postleitzahl=PLZ gui.residency.input.municipality=Gemeinde gui.residency.input.village=Ortschaft diff --git a/connector/src/test/resources/config/templates/residency.html b/connector/src/test/resources/config/templates/residency.html index 44cf17a4..79c620ea 100644 --- a/connector/src/test/resources/config/templates/residency.html +++ b/connector/src/test/resources/config/templates/residency.html @@ -6,8 +6,8 @@ <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta name="viewport" content="width=device-width, initial-scale=1"> - <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/> - <script type="text/javascript" src="$contextPath/static/js/jquery-3.6.0.js" + <link rel="stylesheet" href="../webcontent/css/css_country.css" th:href="@{/static/css/css_country.css}"/> + <script type="text/javascript" src="../webcontent/js/jquery-3.6.0.js" th:attr="src=@{/static/js/jquery-3.6.0.js}"></script> <title th:text="#{gui.residency.title}">Österreichischer Wohnsitz</title> <script type="text/javascript" th:inline="javascript"> @@ -23,12 +23,16 @@ $("#loading").hide(); } }); + $("#inputForm input[type='text']").keyup(function (event) { + if (event.keyCode === 13) { + $("#buttonSearch").click(); + } + }); }); function search() { let updatedText = /*[[#{gui.residency.updated}]]*/ 'Updated text'; let errorText = /*[[#{gui.residency.error}]]*/ 'Error'; - let applyText = /*[[#{gui.residency.apply}]]*/ 'Apply'; let foundText = /*[[#{gui.residency.found}]]*/ 'Found {0}'; let uniqueText = /*[[#{gui.residency.unique}]]*/ 'Unique'; let invalidInputText = /*[[#{gui.residency.header.inputinvalid}]]*/ 'Invalid'; @@ -42,7 +46,7 @@ url: "http://localhost:8080/ms_connector/residency/search", data: $("#inputForm").serialize() }).done(function (data, textStatus, jqXHR) { - if (data["resultCount"] == 1) { + if (data["resultCount"] === 1) { $("#textResult").show().text(uniqueText); $("#tableResult tbody").empty(); $("#tableResult").hide(); @@ -59,23 +63,23 @@ $.each(data.results, function (i, output) { $("#tableResult tbody") .append($("<tr>") - .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "")) + .append($("<td>").text(output["postleitzahl"] !== null ? output["postleitzahl"] : "").css("text-align", "right")) .append($("<td>").text(output["municipality"] !== null ? output["municipality"] : "")) .append($("<td>").text(output["village"] !== null ? output["village"] : "")) .append($("<td>").text(output["street"] !== null ? output["street"] : "")) - .append($("<td>").text(output["number"] !== null ? output["number"] : "")) - .append($("<td>").text(applyText).attr("href", "#").click(function () { - $("#inputForm #inputPostleitzahl").val($(this).parent().children("td:nth-child(1)").text()); - $("#inputForm #inputMunicipality").val($(this).parent().children("td:nth-child(2)").text()); - $("#inputForm #inputVillage").val($(this).parent().children("td:nth-child(3)").text()); - $("#inputForm #inputStreet").val($(this).parent().children("td:nth-child(4)").text()); - $("#inputForm #inputNumber").val($(this).parent().children("td:nth-child(5)").text()); + .append($("<td>").text(output["number"] !== null ? output["number"] : "").css("text-align", "right")) + .css("cursor", "pointer").click(function () { + $("#inputForm #inputPostleitzahl").val($(this).children("td:nth-child(1)").text()); + $("#inputForm #inputMunicipality").val($(this).children("td:nth-child(2)").text()); + $("#inputForm #inputVillage").val($(this).children("td:nth-child(3)").text()); + $("#inputForm #inputStreet").val($(this).children("td:nth-child(4)").text()); + $("#inputForm #inputNumber").val($(this).children("td:nth-child(5)").text()); $("#textResult").show().text(updatedText); search(); - })) + }) ); }) - if (data.results.length == 0) { + if (data.results.length === 0) { $("#tableResult").hide(); } }).fail(function (jqXHR, textStatus, errorThrown) { @@ -93,9 +97,46 @@ } </script> <style> - td { + #residency label { + width: 10em; + display: inline-block; + margin-bottom: 0.5em; + } + + #residency input { + width: 15em; + display: inline-block; + margin-bottom: 0.5em; + } + + #result { + margin-bottom: 4em; + } + + button { padding: 0.5em; margin: 0.5em; + width: 8em; + } + + .block { + width: 100%; + } + + #tableResult td, #tableResult th { + padding: 1em 0.5em; + } + + #tableResult a { + text-decoration: underline; + } + + #tableResult { + border-collapse: collapse; + } + + #tableResult tr { + border-bottom: 1px solid black; } </style> </head> @@ -135,7 +176,8 @@ <div id="residency"> <form id="inputForm" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <div th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</div> + <div><p th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</p> + </div> <div> <label for="inputPostleitzahl" th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</label> <input type="text" id="inputPostleitzahl" name="postleitzahl" value=""/> @@ -156,38 +198,42 @@ <label for="inputNumber" th:text="#{gui.residency.input.number}">Number</label> <input type="text" id="inputNumber" name="number" value=""/> </div> - <div> - <button type="button" class="block" onclick="search()" th:attr="value=#{gui.residency.search}">Search + <div class="block"> + <button type="button" id="buttonSearch" onclick="search()" th:text="#{gui.residency.search}"> + Search </button> - </div> - <div> - <button type="button" class="block" onclick="clearInput()" th:attr="value=#{gui.residency.clear}">Clear + <button type="button" id="buttonClear" onclick="clearInput()" th:text="#{gui.residency.clear}"> + Clear </button> - </div> - <div> - <button type="button" class="block" th:attr="value=#{gui.residency.proceed}">Proceed</button> - </div> - <div> - <img id="loading" src="$contextPath/static/img/ajax-loader.gif" - th:attr="src=@{/static/img/ajax-loader.gif}"/> + <button type="button" id="buttonProceed" th:text="#{gui.residency.proceed}">Proceed</button> </div> <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/> </form> </div> + <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> + <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.residency.cancel}">Cancel</button> + <input type="hidden" name="stopAuthProcess" value="true"> + <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> + </form> + + <div> + <img id="loading" src="$contextPath/static/img/ajax-loader.gif" + th:attr="src=@{/static/img/ajax-loader.gif}" style="display: none"/> + </div> + <div id="result"> <div> - <p><span id="textResult"></span></p> + <p><span id="textResult" style="display: none"></span></p> </div> - <table id="tableResult"> + <table id="tableResult" style="display: none"> <thead> <tr> - <th th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</th> + <th th:text="#{gui.residency.input.postleitzahl}" style="text-align: right">Postcode</th> <th th:text="#{gui.residency.input.municipality}">Municipality</th> <th th:text="#{gui.residency.input.village}">Village</th> <th th:text="#{gui.residency.input.street}">Street</th> - <th th:text="#{gui.residency.input.number}">Number</th> - <th th:text="#{gui.residency.apply}">Apply</th> + <th th:text="#{gui.residency.input.number}" style="text-align: right">Number</th> </tr> </thead> <tbody> @@ -196,13 +242,6 @@ </table> </div> - <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> - <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel" - th:attr="value=#{gui.residency.cancel}"> - <input type="hidden" name="stopAuthProcess" value="true"> - <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"> - </form> - </div> <footer> <div class="copyright">© BUNDESMINISTERIUM FÜR INNERES</div> |