Click here to Skip to main content
15,843,200 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I have provide discount to specific reason and i am using modal for provide discount on cart product. when click discount i got bootstrap modal
HTML
<div class="modal fade" id="discountModal" tabindex="-1" aria-labelledby="discountModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-dialog-centered modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="discountModallLabel">Discounts</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body" id="discountModalBody">
      <form id="frmdiscountModal">
        <div class="row">
          <div class="col-6">
            <h6>Discount Type</h6>
             <input type="radio" class="btn-check" name="discountTypeRadioButton" id="discountTypeRadioButton_Value" autocomplete="off" checked="@(speficreason.DefaultType == 2 ? IsDiscountTypeSelected(DiscountType.Value) : false)">
               <label class="btn btn-outline-info flex-column btn-lg" for="discountTypeRadioButton_Value">
                  Value
               </label>
              <input type="radio" class="btn-check" name="discountTypeRadioButton" id="discountTypeRadioButton_Percentage" autocomplete="off" checked="@(speficreason.DefaultType == 1 ? IsDiscountTypeSelected(DiscountType.Percentage) : false)">
              <label class="btn btn-outline-info flex-column btn-lg" for="discountTypeRadioButton_Percentage">
                  Percentage %
              </label>
          @if (Disreasons.Any() && Disreasons.Count>0)
          {
            <h6>Discount Reason</h6>
            @for(var i = 0; i < Disreasons.Count(); i++)
             {
               var reason = Disreasons[i];
              <input type="radio" class="btn-check" name="discountReasonRadioButton" id="discountReasonRadioButton_@i" autocomplete="off">
              <label class="btn btn-outline-secondary" for="discountReasonRadioButton_@i" @onclick="(()=>GetDefault(reason))">
                 @Disreasons[i].ReasonName
               </label>
             }
          }
          </div> 
          <div class="col-6">
            <div class="input-group">  
               <input type="number" @bind="speficreason.DefaultValue" id="discountModalInput" class="form-control">
           </div>
        
        <div class="d-flex flex-wrap numberpad">
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(7)">7</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(8)">8</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(9)">9</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(4)">4</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(5)">5</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(6)">6</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(1)">1</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(2)">2</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(3)">3</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(-1)">.</button>
          <button type="button" class="btn btn-primary btn-lg" @onclick="() => HandleNumberPadClick(0)">0</button>
          <button type="button" class="btn btn-primary btn-lg"></button>
        </div>
      </div>
        <span style="background-color:red;font-size:medium">@instructdisc</span>
    </div>
  </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
      <button type="button" class="btn btn-primary" id="btnsavechng" @onclick="handleoffer"> Save changes</button>
      </div>
    </div>
  </div>
</div>


C#
 private int? selectedDiscountType;
public void GetDefault(DiscountReasonModel reason)
        {
            speficreason = reason;
            selectedDiscountType= reason.DefaultType;
            StateHasChanged();
        }
        private bool IsDiscountTypeSelected(DiscountType discountType)
        {
            return selectedDiscountType == (int?)discountType;
        }


when select the reason Getdefault method called at the time IsDiscountTypeSelected called if returns true discounttype radiobutton checked either percentage or value but this works well but when reopen modal i got the data properly but discountype and defaultvalue not binding.what is the issue i didnt get. How to fix this. This application blazor Webassembly

What I have tried:

when select the reason Getdefault method called at the time IsDiscountTypeSelected called if returns true discounttype radiobutton checked either percentage or value but this works well but when reopen modal i got the data properly but discountype and defaultvalue not binding.what is the issue i didnt get. How to fix this. This application blazor Webassembly
Posted
Updated 5-Jul-23 7:36am

1 solution

The reason you are getting values for some and not others is because you're binding to the events for some and not others. eg:
C#
@onclick="..."


For two-way binding use:
C#
@bind-value="..."

This will auto-bind and trigger an onchanged update event when the control looses focus.

You can read more here: Blazor University - Binding directives[^]
 
Share this answer
 
Comments
Krishna Veni 5-Jul-23 13:15pm    
what you said that is not clear.please said clearly. its my humble request.
Graeme_Grant 5-Jul-23 19:25pm    
The link provided goes into more detail than I can provide here,
Krishna Veni 5-Jul-23 20:30pm    
That provide concept only.realted example asking clearly.
Graeme_Grant 5-Jul-23 20:39pm    
bind="..." is one-way binding from source to UI; @oninput="..." or @onclick="..." is one-way (event) binding from UI to source. @bind-value="..." is two-way binding. So Binds source to UI on update, and binds UI to source when event is raised, updating the property value. It's all mentioned in the link provided. I also gave you that link as the website will help you with many other "future" questions that you have. It is one of the best Blazor core information sources out there.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900