Fixen des Accordion Schließen Bugs sowie das lösen des RadioButton Design und Work-Problems

This commit is contained in:
ja
2021-09-24 16:51:06 +02:00
parent 4d0444d40a
commit ca2d8dfc24
8 changed files with 168 additions and 256 deletions

View File

@@ -27,12 +27,14 @@
<link rel="stylesheet" type="text/css" href="../css/Customers/MasterpageCustomers.css"/>
<link rel="stylesheet" type="text/css" href="../css/navbarsidebar2.css"/>
<link rel="stylesheet" type="text/css" href="../css/Customers/CustomsAVISO.css"/>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:ScriptManager ID="script1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="panelupdate1" runat="server" UpdateMode="Conditional"><ContentTemplate>
<!-- Webiste-Content-->
<div id="containerseiterand" style="margin-left:auto;margin-right:auto">
<div class="container-fluid">
@@ -74,33 +76,34 @@
<div style="height:0.936768149882904vh"></div>
<div class="col-12" style="margin-left:8px" >
<asp:Label ID="lbl_ArtderAuftraege" runat="server" Text="Auftrags-Status:" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn nichts angewählt ist, bitte das Datum eingrenzen."></asp:Label>
</div>
</div>
<div class="d-none d-md-block">
<div style=" width:780px; margin-left:8px">
<asp:RadioButtonList id="RadioButtonList1" runat="server" RepeatDirection="Horizontal" style="border-color:#fff">
<asp:ListItem ID="rbt_Alle" name="radios" style="font-size:/*17px*/1.063em;margin-left:0px"><label id="lbl_rbt_Alle" for="rbt_Alle" style="margin-left:3px;">Alle</label></asp:ListItem>
<asp:ListItem ID="rbt_Erf" name="radios" style="font-size:/*17px*/1.063em;margin-left:4px"><label id="lbl_rbt_Erf" for="rbt_Erf" style="margin-left:3px;">Erfasst</label></asp:ListItem>
<asp:ListItem ID="rbt_Vorb" name="radios" style="font-size:/*17px*/1.063em;margin-left:4px"><label id="lbl_rbt_Vorb" for="rbt_Vorb" style="margin-left:3px;">Vorbereitet</label></asp:ListItem>
<asp:ListItem ID="rbt_Vorg" name="radios" style="font-size:/*17px*/1.063em;margin-left:4px"><label id="lbl_rbt_Vorg" for="rbt_Vorg" style="margin-left:3px;">Vorgeschrieben</label></asp:ListItem>
<asp:ListItem ID="rbt_Ankunft" name="radios" style="font-size:/*17px*/1.063em;margin-left:4px"><label id="lbl_rbt_Ankunft" for="rbt_Ankunft" style="margin-left:3px;">Ankunft</label></asp:ListItem>
<asp:ListItem ID="rbt_Freig" name="radios" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." style="font-size:/*17px*/1.063em;margin-left:4px"><label id="lbl_rbt_Freig" for="rbt_Freig" style="margin-left:3px;">Freigabe</label></asp:ListItem>
</asp:RadioButtonList>
<div style=" width:780px; margin-left:8px">
<fieldset>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input id="rbt_Alle" onchange="GetSelectedVal(this)" type="radio" name="art" value="Alle" data-bs-toggle="tooltip" style="margin-right:4px" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." runat="server"/>Alle</label>
<label><input id="rbt_Erf" onchange="GetSelectedVal(this)" type="radio" name="art" value="Erfasst" style="margin-right:4px" runat="server"/>Erfasst</label>
<label><input id="rbt_Vorb" onchange="GetSelectedVal(this)" type="radio" name="art" value="Vorbereitet" style="margin-right:4px" runat="server"/>Vorbereitet</label>
<label><input id="rbt_Vorg" onchange="GetSelectedVal(this)" type="radio" name="art" value="Vorgeschrieben" style="margin-right:4px" runat="server"/>Vorgeschrieben</label>
<label><input id="rbt_Ankunft" onchange="GetSelectedVal(this)" type="radio" name="art" value="Ankunft" style="margin-right:4px" runat="server"/>Ankunft</label>
<label><input id="rbt_Freig" onchange="GetSelectedVal(this)" type="radio" name="art" value="Freigabe" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." style="margin-right:4px" runat="server">Freigabe</label>
</fieldset>
</div>
</div>
<div class="d-md-none">
<div class="col-8" style="margin-left:8px" >
<asp:RadioButtonList id="RadioButtonList2" runat="server" RepeatDirection="Vertical" style="border-color:#fff">
<asp:ListItem ID="rbt_Alle_M" name="radios" style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Alle_M" for="rbt_Alle_M" style="margin-left:3px;">Alle</label></asp:ListItem>
<asp:ListItem ID="rbt_Erf_M" name="radios" style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Erf_M" for="rbt_Erf_M" style="margin-left:3px;">Erfasst</label></asp:ListItem>
<asp:ListItem ID="rbt_Vorb_M" name="radios" style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Vorb_M" for="rbt_Vorb_M" style="margin-left:3px;">Vorbereitet</label></asp:ListItem>
<asp:ListItem ID="rbt_Vorg_M" name="radios" style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Vorg_M" for="rbt_Vorg_M" style="margin-left:3px;">Vorgeschrieben</label></asp:ListItem>
<asp:ListItem ID="rbt_Ankunft_M" name="radios" style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Ankunft_M" for="rbt_Ankunft_M" style="margin-left:3px;">Ankunft</label></asp:ListItem>
<asp:ListItem ID="rbt_Freig_M" name="radios" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." style="font-size:/*17px*/1.063em"><label id="lbl_rbt_Freig_M" for="rbt_Freig_M" style="margin-left:3px;">Freigabe</label></asp:ListItem>
</asp:RadioButtonList>
</div>
<div class="col-8" style="margin-left:8px">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input id="rbt_Alle_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Alle" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." class="CSS_input" runat="server"/>Alle</label>
<label><input id="rbt_Erf_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Erfasst" style="margin-right:4px" runat="server"/>Erfasst</label>
<label><input id="rbt_Vorb_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Vorbereitet" style="margin-right:4px" runat="server"/>Vorbereitet</label>
<label><input id="rbt_Vorg_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Vorgeschrieben" style="margin-right:4px" runat="server"/>Vorgeschrieben</label>
<label><input id="rbt_Ankunft_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Ankunft" style="margin-right:4px" runat="server"/>Ankunft</label>
<label><input id="rbt_Freig_M" onchange="GetSelectedVal(this)" type="radio" name="art2" value="Freigabe" data-bs-toggle="tooltip" data-bs-placement="top" title="Wenn dieser Filter angewählt ist, bitte das Datum eingrenzen." style="margin-right:4px" runat="server">Freigabe</label>
</div>
</div>
</div>
<asp:HiddenField ID="hfAccordionIndex" runat="server" />
<div style="height:0.936768149882904vh"></div>
<div class="col-12" id="cont4">
<div class="col-12" id="container2" style="margin-left:2px">
@@ -109,12 +112,10 @@
<asp:Label ID="lbl_bis" runat="server" Text="Bis:"></asp:Label>
<asp:TextBox id="pickdate2" Type="Date" CssClass="classTarget" runat="server"></asp:TextBox>
<asp:Label ID="lbl_ErrorCal" runat="server" Text=""></asp:Label>
</div>
<div id="Abstand"></div>
<hr>
<div id="accordion">
<div class="accordion" id="accordionExample">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
@@ -122,7 +123,7 @@
</h2>
</div>
<div id="collapseOne" class="accordion-collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div id="collapseOne" class="accordion-collapse collapse hide" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="card card-body">
<div class="col-12" id="cont3">
<div class="container">
@@ -190,7 +191,7 @@
</asp:Table>
</div>
</div></div>
</div></div></div>
</div>
<br /><br /><br />
<% End If
@@ -201,46 +202,29 @@
End Try %>
<div></div></div> </ContentTemplate></asp:UpdatePanel>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$('#accordion').on('shown.bs.collapse', function (e) {
$(e.target).data('bs.collapse').$trigger.attr('src', 'https://s22.postimg.org/hkrauaofx/Mathematic_Minus2.png');
});
$('#accordion').on('hidden.bs.collapse', function (e, f) {
$(e.target).data('bs.collapse').$trigger.attr('src', 'https://s22.postimg.org/9takvqkal/Mathematic_Plus2.png');
});
</script>
<script type='text/javascript'>
$(document).ready(function() {
/*$("#container2").hide();*/
$('#<%=RadioButtonList1.ClientID %> input[type="radio"]').change(function () {
var idVal = $(this).attr("id");
/*alert($("label[for='" + idVal + "']").text());*/
if ($("label[for='" + idVal + "']").text() == "Alle") {
$("#container2").show();
} else if ($("label[for='" + idVal + "']").text() == "Freigabe") {
$("#container2").show();
} else {
$("#container2").hide();
}
});
$('#<%=RadioButtonList2.ClientID %> input[type="radio"]').change(function () {
var idVal = $(this).attr("id");
/*alert($("label[for='" + idVal + "']").text());*/
if ($("label[for='" + idVal + "']").text() == "Alle") {
$("#container2").show();
} else if ($("label[for='" + idVal + "']").text() == "Freigabe") {
$("#container2").show();
} else {
$("#container2").hide();
}
});
});
</script>
</script>
<script>
function GetSelectedVal(ele) {
var el = $(ele).closest('label').text();
if (el == "Alle") {
$("#container2").show();
} else if (el == "Freigabe") {
$("#container2").show();
} else {
$("#container2").hide();
}
}
</script>
<script type="text/javascript">
$(document).ready(function () {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
@@ -248,39 +232,6 @@
function EndRequestHandler(sender, args) {
$('.classTarget).datepicker({ dateFormat: 'dd.MM.yyyy' });
}
});
</script>
<script>
$(document).ready(function () {
$(".accordion .accordion-collapse").on('shown.bs.collapse', function () {
var active = $(this).attr('id');
var panels = localStorage.panels === undefined ? new Array() : JSON.parse(localStorage.panels);
if ($.inArray(active, panels) == -1) //check that the element is not in the array
panels.push(active);
localStorage.panels = JSON.stringify(panels);
});
$(".accordion .accordion-collapse").on('hidden.bs.collapse', function () {
var active = $(this).attr('id');
var panels = localStorage.panels === undefined ? new Array() : JSON.parse(localStorage.panels);
var elementIndex = $.inArray(active, panels);
if (elementIndex !== -1) //check the array
{
panels.splice(elementIndex, 1); //remove item from array
}
localStorage.panels = JSON.stringify(panels); //save array on localStorage
});
var panels = localStorage.panels === undefined ? new Array() : JSON.parse(localStorage.panels); //get all panels
for (var i in panels) { //<-- panel is the name of the cookie
if ($("#" + panels[i]).hasClass('accordion-collapse')) // check if this is a panel
{
$("#" + panels[i]).collapse("show");
}
}
});
</script>
</script>
</asp:Content>