Jump to content



Δημιουργία "διαδραστικού" Excel (και ενδεχόμενη μετατροπή σε HTML)


Recommended Posts

Καλησπέρα,

 

Φτιάχνω ένα Excel για κάποια δουλειά και έχω δημιουργήσει ορισμένες drop down λίστες. Αυτά που με ενδιαφέρει να κανω ακόμη, και θέλω να μάθω αν και πώς ακριβώς γίνονται, είναι τα εξής:

 

Έστω αρχικά ότι η λίστα "2" έχει 10 επιλογές και η λίστα "1" έχει δύο επιλογές. Γίνεται, αν από τη λίστα 1 επιλέξω την πρώτη επιλογή να βγάζει στη 2 τα 5 αποτελέσματα και με τη δεύτερη επιλογή τα άλλα 5 ;

 

Δεύτερο, και μάλλον σημαντικότερο. Αν υποθέσουμε οτι ξεπερνάμε το παραπάνω, γίνεται να εμφανίζεται ένα συγκεκριμένο κείμενο σε κάποιο προκαθορισμένο σημείο κάφε φορά που ο χρήστης κάνει κάποια επιλογή από τη Χ λίστα ; Και αν ναι, πώς ; Το κείμενο πρακτικά, για να σας δώσω να καταλάβετε θα είναι κάτι σαν επεξήγηση της εκάστοτε επιλογής

 

Τρίτο και εξίσου σημαντικό : Αν ολοκληρωθεί το παραπάνω, υπάρχει η δυνατότητα εξαγωγής του (σε μη στατική μορφή βέβαια), σε HTML ώστε να "τρέχει" και μέσω browser ; Αν ναι, πώς ; Κάτι διάβασα για κάποια plugins αλλά αν μπορεί να γίνει απευθείας από το Excel θα ήταν καλύτερα.

 

Thanks προκαταβολικά :)

 

Link to comment
Share on other sites

Για το excel που φτιάχνεις χρησιμοποιείς VΒ for applications ή τα κάνεις όλα με formulas και τις έτοιμες δυνατότητες;

 

Π.χ. drop down λιστα μπορεί να φτιαχτεί και από το Data, Validation.

 

Τα 2 πρώτα που θέλεις, ναι γίνονται.

  • Like 1
Link to comment
Share on other sites

Τις λίστες τις έχω κάνει οπως λές και εσύ, από το Data validation. Τα υπόλοιπα, επειδή είναι σχετικά απλά τα έχω κάνει μέσω των ενσωματωμένων συναρτήσεων και με καλύπτουν απόλυτα.

 

Αυτό που με ενδιαφέρει είναι από μπορεί να προβάλει ένα ξεχωριστό μήνυμα για κάθε επιλογή από τη λίστα (που να μη φαίνεται πριν γίνει η επιλογή βέβαια) και αν όλο αυτό μπορεί να βγει (και να είναι λειτουργικό), σε html.

Link to comment
Share on other sites

Hmm ενδιαφέρον θέμα

 

http://blogs.msdn.com/b/officeapps/archive/2013/03/18/excel-does-javascript-a-vba-developer-s-perspective.aspx

 

http://msdn.microsoft.com/en-us/library/fp142185.aspx

 

Δυστυχώς μόνο σε Office 2013 και πάντα μέσα από το ίδιο το Excel. Τι ακριβώς θέλεις να κάνεις από την html σελίδα?

  • Like 1
Link to comment
Share on other sites

Ευχαριστώ για τα links, θα τα τσεκάρω κάποια στιγμή που θα έχω τον απαιτούμενο χρόνο.

 

Θέλω απλά να δουλεύει, αν είναι δυνατόν μέσω browser γιατί είναι ότι βολικότερη για τη χρήση που προορίζεται.
 

Link to comment
Share on other sites

Σε ενδιαφέρει να παίρνουν τις τιμές τους τα dropdowns από το excel ή να σώζουν τα δεδομένα πίσω στο excel?

 

Αν όχι θα μπορούσες να το κάνεις με μια στατική σελίδα html και javascript.

Link to comment
Share on other sites

Δεν θέλω να σώζουν δεδομένα. Θέλω για παράδειγμα αν από τη λίστα επιλεχθεί το "1" να εμφανίζει δίπλα το κείμενο "Α" το οποίο θα είναι συγκεκριμένο και δεν αλλάζει.

 

Με HTML και Javascript θα μου άρεσε κι εμένα αλλά δεν σκαμπάζω. Εκτός κι αν υπάρχει κάποιο προγραμματάκι που "σχεδιάζεις" αυτό που θέλεις και το κάνει Export στη συνέχεια.

Link to comment
Share on other sites

To έφτιαξα. wall of code incoming

<!DOCTYPE html><html><head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1">    <title></title>    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"></head><body>    <div class="container">        <div class="row">            <div class="form">                <div class="form-group col-md-6">                    <label for="dropdown">Pick an option</label>                    <select id="dropdown" class="form-control">                      <option value="Text for alert when option 1 is selected">1</option>                      <option value="Text for alert when option 2 is selected">2</option>                      <option value="Text for alert when option 3 is selected">3</option>                      <option value="Text for alert when option 4 is selected">4</option>                      <option value="Text for alert when option 5 is selected">5</option>                    </select>                </div>                <div class='popover-container'></div>            </div>            </div>    </div>    <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>    <script>    $(document).ready(function(){        $("#dropdown").popover({            placement:'right',            title:'Info',            trigger:'manual',            container:'.popover-container',            content: function() {                return $( "select option:selected" ).prop('value')            }        });    });        $('#dropdown').on('change',function(e) {        $('#dropdown').popover('show')    });    </script></body></html>

To παραπάνω είναι ο κώδικας της html σελίδας.Για πες αν σου αρέσει ή απορίες. Note:Χρειάζεται internet μιας και φορτώνει τα πάντα από cdn.

 

Made with bootstrap and jquery.

  • Like 1
Link to comment
Share on other sites

Λοιπόν, αν δε θέλεις να βάλεις κώδικα, η λύση στο 2 είναι η Vlookup σε συνδυασμό με το Validation που χρησιμοποιείς.

 

Στο συνημμένο θα βρεις ένα παράδειγμα (sheet Case 2). Στο Sheet Lists είναι οι τιμές για το data validation (προτιμώ να τις βάζω κάπου ξεχωριστά). Αν θέλεις να το κάνεις πιο εμφανίσιμο βάλε και την IFERROR για να μη βγαίνει N/A μέχρι να γεμίσει με τιμές (όπως στη στήλη Ε)

 

Το 1 είναι πιο περίπλοκο γιατί το validation δε δέχεται conditions. Δέχεται όμως δυναμικές τιμές, οπότε ένα workaround είναι στο sheet case 1, όπου χρειάζεσαι όμως χώρο που θα γεμίζει με τις τιμές της εκάστοτε λίστας για κάθε γραμμή (με γκρι). Αυτός ο χώρος πρέπει να κρυφτεί και να πάει κάπου που δε θα ενοχλεί το χρήστη. Επίσης, αν αλλάξει εκ των υστέρων την τιμή της λίστας 1 η επιλογή της λίστας 2 δεν αλλάζει (το data validation δεν έχει αναδρομικό έλεγχο), μπορείς όμως να το επισημάνεις με το circle invalid data ή με conditional formatting.

Hayabusa.xlsx

  • Like 1
Link to comment
Share on other sites

@nucleus

 

Σε ευχαριστώ πολύ για τον κόπο. Μόλις το είδα και μου φάνηκε πάρα πολύ καλό. Μάλλον θα συνεχίσω πάνω σε αυτό.

Υπόψην ότι τώρα που έγινε μια κάποια αρχή θα σε πρήξω, αν δεν έχει αντίρρηση βέβαια, γιατί θυμάμαι ελάχιστα από HTML :p

 

Άλλη μια απορία λοιπόν. Υπάρχει δυνατότητα να μπουν checkboxes και συνθήκες οι οποίες αν πληρούνται θα τρέχουν κάποιες πράξεις ; ΠΧ αν τσεκάρω το box 1 να αφαιρεί ένα ποσοστό από μια προκαθορισμένη τιμή ;

 

όταν αρχίσω να γίνομαι κουραστικός απλά πες το :p

 

@asot

Σε ευχαριστώ πολύ για τον κόπο. Θα το δω και αυτό το συντομότερο δυνατόν :)

Link to comment
Share on other sites

Ναι αυτό που αναφέρεις με τα checkboxes μπορεί να γίνει

 

Copy paste το παρακάτω μετά το div που έχει class=row

<div class="row"> <div class="form-group col-md-6">  <label for="price">Price</label>  <label id="price">40</label>  <div class="checkbox">   <label>    <input type="checkbox" id="checkbox1">Add 10 to Price   </label>   <label>    <input type="checkbox" id="checkbox2">Minus 10 from Price   </label>       <label>    <input type="checkbox" id="checkbox3">Add 20 to Price   </label>      </div> </div></div>

Μετά μέσα στο <script></script> το παρακάτω

$('#checkbox1').on('change',function(e) {        var currentValue = parseInt($("#price").text(),10);        if($(this).is(':checked'))        {            $("#price").empty().text(currentValue + 10);        }        else        {            $("#price").empty().text(currentValue - 10);        }    });        $('#checkbox2').on('change',function(e) {        var currentValue = parseInt($("#price").text(),10);        if($(this).is(':checked'))        {            $("#price").empty().text(currentValue - 10);        }        else        {            $("#price").empty().text(currentValue + 10);        }    });        $('#checkbox3').on('change',function(e) {        var currentValue = parseInt($("#price").text(),10);        if($(this).is(':checked'))        {            $("#price").empty().text(currentValue + 20);        }        else        {            $("#price").empty().text(currentValue - 20);        }    });

Αν το κατάλληλο checkbox είναι επιλεγμένο κάνει αυτό που λέει το κείμενο στην τρέχουσα τιμή του Price αν όχι το αναιρεί.

 

ParseInt αν το price είναι ακέραιος.ParseFloat αν είναι δεκαδικός.

 

http://www.w3schools.com/jsref/jsref_parseint.asp

 

http://www.w3schools.com/jsref/jsref_parsefloat.asp

Link to comment
Share on other sites

@nucleus, έκατσα σήμερα και έκανα κάποιες πρώτες δοκιμούλες για να φέρω τον κώδικα στα μέτρα μου. Μια απορία (για αρχή :p ) στο text box που εμφανίζει με κάθε επιλογή από τη λίστα, υπάρχει δυνατότητα το κείμενο να έχει bold/italics και να είναι όλο στην ίδια σειρά ή τέλος πάντως να μπορώ να το στοιχίσω όπως θέλω εγώ ; :)

Link to comment
Share on other sites

Αυτό με τη στίχηση το έλυσα (πρόχειρα μεν αλλά λύθηκε) βάζοντας κενά με το  

 

Στο θέμα των checkboxes θα ήθελα να το πάω ένα βήμα παραπέρα και να δώσω σε κάθε επιλογή της λίστας από μια συγκριμένη τιμή ώστε πάνω σε αυτή να γίνονται οι πράξεις που προανέφερα.Γίνεται αυτό ; :)

Link to comment
Share on other sites

έκατσα σήμερα και έκανα κάποιες πρώτες δοκιμούλες για να φέρω τον κώδικα στα μέτρα μου. Μια απορία (για αρχή :p ) στο text box που εμφανίζει με κάθε επιλογή από τη λίστα, υπάρχει δυνατότητα το κείμενο να έχει bold/italics και να είναι όλο στην ίδια σειρά ή τέλος πάντως να μπορώ να το στοιχίσω όπως θέλω εγώ ; :)

 

Ποιό κείμενο? Οι επιλογές του Dropdown ή το κείμενο που εμφανίζεται στο popover όταν αλλάζεις επιλεγμένη τιμή?

 

 

Αυτό με τη στίχηση το έλυσα (πρόχειρα μεν αλλά λύθηκε) βάζοντας κενά με το  

 

Στο θέμα των checkboxes θα ήθελα να το πάω ένα βήμα παραπέρα και να δώσω σε κάθε επιλογή της λίστας από μια συγκριμένη τιμή ώστε πάνω σε αυτή να γίνονται οι πράξεις που προανέφερα.Γίνεται αυτό ; :)

 

Eδώ θέλεις απλώς η κάθε επιλογή από το dropdown δηλαδή το 1,2,3,4 να έχει μια τιμή πχ 10,20,30,40 και το checkbox να αλλάζει την τιμή αυτή?

Link to comment
Share on other sites

To popover έχει class popover-container.

    <style scoped>    .popover-container {        text-align:justify;        font-style: italic;    }    </style>

To παραπάνω σου κάνει το κείμενο justify και italic. Δυστυχώς το font-weight που καθορίζει το bold δεν έκανε κάτι.

 

Για το δεύτερο ναι μπορεί να γίνει θα το έχεις σύντομα.

Ερώτηση υπάρχει αντιστοιχία των checkbox με τις επιλογές στο Dropdown? δηλαδή αν επιλέξεις το πρώτο checkbox θα κάνει την πράξη που του αντιστοιχεί στο value της επιλογής 1 είναι δεν είναι επιλεγμένη στο Dropdown ή κάθε checkbox θα κάνει την αντίστοιχη πράξη του στο value της επιλεγμένης τιμής στο Dropdown? αν ξετικάρεις το checkbox απλώς θα αναιρεί την πράξη που έγινε σωστά?

Έγινε επεξεργασία από nucleus
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Δημιουργία...

Important Information

Ο ιστότοπος theLab.gr χρησιμοποιεί cookies για να διασφαλίσει την καλύτερη εμπειρία σας κατά την περιήγηση. Μπορείτε να προσαρμόσετε τις ρυθμίσεις των cookies σας , διαφορετικά θα υποθέσουμε ότι είστε εντάξει για να συνεχίσετε.