Đặt lại chọn tùy chọn html

Giá trị của tùy chọn "Vui lòng chọn" không phải là "Vui lòng chọn" mà trống

điều này sẽ thực hiện thủ thuật (hoặc bạn chỉ có thể đưa ra một giá trị cho nó và sử dụng nó)

$('#payment-type').val('');

1 thấy điều này hữu ích thumb_up thumb_down

Không chắc chủ đề này có phải là nơi dành cho nó hay không nhưng tôi đã gặp sự cố này cũng như một số vấn đề liên quan mà tôi nghĩ mình sẽ chia sẻ cho hậu thế

Giá trị được chọn là thuộc tính nhưng giá trị tùy chọn là thuộc tính

Bắt các kết hợp này dẫn đến hành vi kỳ lạ như giá trị mặc định không chính xác, văn bản biến mất và các tùy chọn bị vô hiệu hóa không hiển thị

select [ Html.Attributes.property "value" (Encode.string "my-value") ]
    [ option [ Html.Attributes.attribute "value" "my-value" ] []
    ]

Sử dụng Html một cách rõ ràng. Thuộc tính. thuộc tính để đặt giá trị của tùy chọn thay vì Html. Thuộc tính. giá trị
https. // ứng dụng ellie. com/9qkCLMDC6r6a1

Trong ví dụ này trên Chrome, cả hai tùy chọn được chọn đều bị tắt nhưng chỉ có tùy chọn đầu tiên sử dụng Html.Attributes.attribute xuất hiện. Cái còn lại sử dụng Html.Attributes.value có vẻ như là một tùy chọn có thể lựa chọn. Nhấp vào kết xuất lại làm cho văn bản của tùy chọn thứ hai biến mất

Trong Firefox, tùy chọn thứ hai xuất hiện ban đầu nhưng biến mất khi kết xuất lại

Cả value của lựa chọn và selected của tùy chọn đều được yêu cầu để giữ kết xuất phù hợp với mô hình của bạn

Ở đây, value của lựa chọn được đặt nhưng kết xuất ban đầu bị sai vì không có tùy chọn nào có selected. Nhấp vào nút NoOp để kết xuất lại và xem giá trị chính xác. Tải lại và giá trị sai đã trở lại. Điều tương tự cũng xảy ra với điều hướng ra khỏi trang và quay lại trang.
https. // ứng dụng ellie. com/9qkMcTdGtK4a1

Bạn có thể dễ dàng đặt chúng thành các giá trị đối lập. Ở đây, kết xuất ban đầu cho biết

select [ Html.Attributes.property "value" (Encode.string "my-value") ]
    [ option [ Html.Attributes.attribute "value" "my-value" ] []
    ]

2 nhưng mô hình là

select [ Html.Attributes.property "value" (Encode.string "my-value") ]
    [ option [ Html.Attributes.attribute "value" "my-value" ] []
    ]

3 và lựa chọn mặc định là

selected : Bool -> Attribute msg
selected =
  boolProperty "selected"
...
boolProperty : String -> Bool -> Attribute msg
boolProperty key bool =
  Elm.Kernel.VirtualDom.property key (Json.bool bool)

0. Nút kết xuất lại hiển thị đúng

select [ Html.Attributes.property "value" (Encode.string "my-value") ]
    [ option [ Html.Attributes.attribute "value" "my-value" ] []
    ]

3.
https. // ứng dụng ellie. com/9qkMPwBRJ4Ja1

Cài đặt cả hai đều giữ giá trị đúng một cách nhất quán.
https. // ứng dụng ellie. com/9qkNtG7Zz6Ga1

Ví dụ về hành vi giá trị lẻ. Nếu bạn có một bộ tùy chọn trung gian (ví dụ: trong khi tải) với

selected : Bool -> Attribute msg
selected =
  boolProperty "selected"
...
boolProperty : String -> Bool -> Attribute msg
boolProperty key bool =
  Elm.Kernel.VirtualDom.property key (Json.bool bool)

2 và Html.Attributes.value, thì tùy chọn này sẽ thay thế tùy chọn selected sau này

Trong ví dụ này, cả value và selected đều được đặt chính xác, nhưng tùy chọn “đang tải…” được hiển thị ngắn gọn sử dụng Html.Attributes.value. Điều này thay thế các tùy chọn sau này và giá trị ban đầu không chính xác của "Tùy chọn Một" được hiển thị. Nhấp vào nút NoOp để kết xuất lại và hiển thị đúng “Chọn một”. Hoặc chỉnh sửa mã để xóa

selected : Bool -> Attribute msg
selected =
  boolProperty "selected"
...
boolProperty : String -> Bool -> Attribute msg
boolProperty key bool =
  Elm.Kernel.VirtualDom.property key (Json.bool bool)

2 khỏi tùy chọn tải và nó sẽ hoạt động như mong đợi

https. // ứng dụng ellie. com/9qkZdWFqbLYa1

Phiên bản thay thế Html.Attributes.value bằng Html.Attributes.attribute0 này hoạt động như mong đợi
https. // ứng dụng ellie. com/9qkYXxGhdNZa1

justinmimbs

Thuộc tính selected của Html.Attributes.attribute2 dường như chỉ để đặt tùy chọn được chọn ban đầu

tôi nghĩ rằng điều này là không chính xác. Mặc dù đúng là thuộc tính phần tử thiết lập thuộc tính ban đầu của dom, nhưng trong elm, selected được triển khai dưới dạng thuộc tính

selected : Bool -> Attribute msg
selected =
  boolProperty "selected"
...
boolProperty : String -> Bool -> Attribute msg
boolProperty key bool =
  Elm.Kernel.VirtualDom.property key (Json.bool bool)

Vì vậy, nó thực sự có thể được sử dụng để thiết lập giá trị lựa chọn. Tuy nhiên, như đã đề cập trong câu trả lời khác, cần phải giữ cho mô hình đồng bộ với dom;

Quay lại vấn đề ban đầu, tôi không hiểu tại sao bạn muốn ngăn thay đổi trong lựa chọn; . Đối với tôi, bạn có thể tắt các tùy chọn mà bạn biết là không thể chọn được hoặc sau khi kiểm tra chương trình phụ trợ, bạn hoàn nguyên thay đổi bằng một thông báo ui thích hợp

Đây là một ví dụ ellie mô phỏng lệnh gọi phụ trợ và sau đó hoàn nguyên giá trị đã chọn. Tôi chắc chắn rằng nó sẽ không quan trọng đối với OP, nhưng vấn đề là giá trị có thể được thay đổi bằng thuộc tính đã chọn và nó trông giống cách của cây du hơn đối với tôi

Làm cách nào để đặt lại tùy chọn đã chọn trong javascript?

Làm cách nào để xóa giá trị đã chọn của DropDownList trong HTML?

Làm cách nào để đặt lại giá trị đã chọn thả xuống trong javascript?

Làm cách nào để đặt lại hộp chọn trong jquery?